2022.1.6

15832144755

2022-01-06 7b4c8991dca9cf2a809a95e239d144697d3afb56

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
import { knockout } from "../../Source/Cesium.js";
 
describe("ThirdParty/knockout", function () {
  it("check binding with constants", function () {
    var div = document.createElement("div");
    div.setAttribute(
      "data-bind",
      '\
cesiumSvgPath: { path: "M 100 100 L 300 100 L 200 300 Z", width: 28, height: 40, css: "someClass" }'
    );
 
    document.body.appendChild(div);
 
    knockout.applyBindings({}, div);
 
    var svg = div.querySelector("svg.cesium-svgPath-svg");
    expect(svg).not.toBeNull();
    expect(svg.getAttribute("width")).toEqual("28");
    expect(svg.getAttribute("height")).toEqual("40");
    expect(svg.getAttribute("class").split(/\s/)).toContain("someClass");
 
    var path = div.querySelector("svg > path");
    expect(path).not.toBeNull();
    expect(path.getAttribute("d")).toEqual("M 100 100 L 300 100 L 200 300 Z");
 
    knockout.cleanNode(div);
    document.body.removeChild(div);
  });
 
  it("check binding with observables", function () {
    var div = document.createElement("div");
    div.setAttribute(
      "data-bind",
      "\
cesiumSvgPath: { path: p, width: w, height: h, css: c }"
    );
 
    document.body.appendChild(div);
 
    knockout.applyBindings(
      {
        p: knockout.observable("M 100 100 L 300 100 L 200 300 Z"),
        w: knockout.observable(28),
        h: knockout.observable(40),
        c: knockout.observable("someClass"),
      },
      div
    );
 
    var svg = div.querySelector("svg.cesium-svgPath-svg");
    expect(svg).not.toBeNull();
    expect(svg.getAttribute("width")).toEqual("28");
    expect(svg.getAttribute("height")).toEqual("40");
    expect(svg.getAttribute("class").split(/\s/)).toContain("someClass");
 
    var path = div.querySelector("svg > path");
    expect(path).not.toBeNull();
    expect(path.getAttribute("d")).toEqual("M 100 100 L 300 100 L 200 300 Z");
 
    knockout.cleanNode(div);
    document.body.removeChild(div);
  });
 
  it("check binding with observable parameter object", function () {
    var div = document.createElement("div");
    div.setAttribute("data-bind", "\
cesiumSvgPath: svgPath");
 
    document.body.appendChild(div);
 
    var viewModel = {
      svgPath: knockout.observable({
        path: knockout.observable("M 100 100 L 300 100 L 200 300 Z"),
        width: knockout.observable(28),
        height: knockout.observable(40),
        css: knockout.observable("someClass"),
      }),
    };
    knockout.applyBindings(viewModel, div);
 
    var svg = div.querySelector("svg.cesium-svgPath-svg");
    expect(svg).not.toBeNull();
    expect(svg.getAttribute("width")).toEqual("28");
    expect(svg.getAttribute("height")).toEqual("40");
    expect(svg.getAttribute("class").split(/\s/)).toContain("someClass");
 
    var path = div.querySelector("svg > path");
    expect(path).not.toBeNull();
    expect(path.getAttribute("d")).toEqual("M 100 100 L 300 100 L 200 300 Z");
 
    knockout.cleanNode(div);
    document.body.removeChild(div);
  });
});