Mercurial > code > home > repos > light9

comparison web/resource-display_test.html @ 2376:4556eebe5d73

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
topdir reorgs; let pdm have its src/ dir; separate vite area from light9/
author drewp@bigasterisk.com
date Sun, 12 May 2024 19:02:10 -0700
parents light9/web/resource-display_test.html@f2265601ead6
children
comparison
equal deleted inserted replaced
2375:623836db99af 2376:4556eebe5d73
1 <!doctype html>
2 <html>
3 <head>
4 <title>resource-display test</title>
5 <meta charset="utf-8">
6 <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
7 <script src="/node_modules/mocha/mocha.js"></script>
8 <script src="/node_modules/chai/chai.js"></script>
9
10 <link rel="stylesheet" media="all" href="/node_modules/mocha/mocha.css">
11 <link rel="import" href="/lib/polymer/lib/elements/dom-bind.html">
12
13 <link rel="import" href="rdfdb-synced-graph.html">
14 <link rel="import" href="resource-display.html">
15 </head>
16 <body>
17 <div id="mocha"><p><a href=".">Index</a></p></div>
18 <div id="messages"></div>
19 <div id="fixtures">
20 <dom-bind>
21 <template>
22 <p>
23 <rdfdb-synced-graph id="graph" test-graph="true" graph="{{graph}}"></rdfdb-synced-graph>
24 </p>
25 <p>
26 resource: <resource-display
27 id="elem"
28 graph="{{graph}}"
29 uri="http://example.com/a"></resource-display>
30 </p>
31 </template>
32 </dom-bind>
33 </div>
34
35 <script>
36 mocha.setup('bdd')
37 const assert = chai.assert;
38
39 describe("resource-display", () => {
40 let elem;
41 let graph;
42 beforeEach((done) => {
43 elem = document.querySelector("#elem");
44 window.elem = elem;
45 graph = document.querySelector("#graph");
46 graph.graph.clearGraph();
47 graph.graph.loadTrig(`
48 @prefix : <http://example.com/> .
49 @prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .
50 :a rdfs:label "label a" :ctx .
51 :b rdfs:label "label b" :ctx .
52 `, done);
53 });
54 const assertLabelTextEquals = (expected) => {
55 assert.equal(elem.shadowRoot.querySelector("#uri").innerText,
56 expected);
57
58 };
59 describe('link display', () => {
60 it("says no uri", () => {
61 elem.setAttribute('uri', '');
62 assertLabelTextEquals("<no uri>");
63 });
64 it("has no link when there's no uri", () => {
65 elem.setAttribute('uri', '');
66 assert.equal(elem.shadowRoot.querySelector("#uri").href,
67 'javascript:;');
68 });
69 it("shows uri's label if graph has one", () => {
70 elem.setAttribute('uri', 'http://example.com/a');
71 assertLabelTextEquals("label a");
72 });
73 it("links to uri", () => {
74 elem.setAttribute('uri', 'http://example.com/a');
75 assert.equal(elem.shadowRoot.querySelector("#uri").href,
76 'http://example.com/a');
77 });
78 it("falls back to uri tail if there's no label", () => {
79 elem.setAttribute('uri', 'http://example.com/nolabel');
80 assertLabelTextEquals("nolabel");
81 });
82 it("falls back to full uri if the tail would be empty", () => {
83 elem.setAttribute('uri', 'http://example.com/');
84 assertLabelTextEquals('http://example.com/');
85
86 });
87 it("changes the label if the graph updates uri's label", () => {
88 const g = graph.graph;
89 elem.setAttribute('uri', 'http://example.com/a');
90
91 g.patchObject(g.Uri('http://example.com/a'),
92 g.Uri('rdfs:label'),
93 g.Literal('new label'));
94 assertLabelTextEquals('new label');
95
96 });
97 it("changes the label if the uri changes", (done) => {
98 elem.setAttribute('uri', 'http://example.com/a');
99 setTimeout(() => {
100 elem.setAttribute('uri', 'http://example.com/b');
101 assertLabelTextEquals('label b');
102 done();
103 }, 100);
104 });
105 });
106 describe('type icons', () => {
107 it("omits icon for unknown type");
108 it("uses icon uri from graph and shows the icon");
109 });
110 describe('rename ui', () => {
111 it("shows rename button if caller wants");
112 it("opens dialog when you click rename");
113 it("shows old label in dialog, ready to be replaced");
114 it("does nothing if you cancel");
115 it("patches the graph if you accept a new name");
116 });
117
118 });
119 mocha.run();
120 </script>
121 </body>
122 </html>