Files
@ 7e7874fed2e3
Branch filter:
Location: light9/web/resource-display_test.html
7e7874fed2e3
4.4 KiB
text/html
buttons to add panels to the layout
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 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 | <!doctype html>
<html>
<head>
<title>resource-display test</title>
<meta charset="utf-8">
<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
<script src="/node_modules/mocha/mocha.js"></script>
<script src="/node_modules/chai/chai.js"></script>
<link rel="stylesheet" media="all" href="/node_modules/mocha/mocha.css">
<link rel="import" href="/lib/polymer/lib/elements/dom-bind.html">
<link rel="import" href="rdfdb-synced-graph.html">
<link rel="import" href="resource-display.html">
</head>
<body>
<div id="mocha"><p><a href=".">Index</a></p></div>
<div id="messages"></div>
<div id="fixtures">
<dom-bind>
<template>
<p>
<rdfdb-synced-graph id="graph" test-graph="true" graph="{{graph}}"></rdfdb-synced-graph>
</p>
<p>
resource: <resource-display
id="elem"
graph="{{graph}}"
uri="http://example.com/a"></resource-display>
</p>
</template>
</dom-bind>
</div>
<script>
mocha.setup('bdd')
const assert = chai.assert;
describe("resource-display", () => {
let elem;
let graph;
beforeEach((done) => {
elem = document.querySelector("#elem");
window.elem = elem;
graph = document.querySelector("#graph");
graph.graph.clearGraph();
graph.graph.loadTrig(`
@prefix : <http://example.com/> .
@prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .
:a rdfs:label "label a" :ctx .
:b rdfs:label "label b" :ctx .
`, done);
});
const assertLabelTextEquals = (expected) => {
assert.equal(elem.shadowRoot.querySelector("#uri").innerText,
expected);
};
describe('link display', () => {
it("says no uri", () => {
elem.setAttribute('uri', '');
assertLabelTextEquals("<no uri>");
});
it("has no link when there's no uri", () => {
elem.setAttribute('uri', '');
assert.equal(elem.shadowRoot.querySelector("#uri").href,
'javascript:;');
});
it("shows uri's label if graph has one", () => {
elem.setAttribute('uri', 'http://example.com/a');
assertLabelTextEquals("label a");
});
it("links to uri", () => {
elem.setAttribute('uri', 'http://example.com/a');
assert.equal(elem.shadowRoot.querySelector("#uri").href,
'http://example.com/a');
});
it("falls back to uri tail if there's no label", () => {
elem.setAttribute('uri', 'http://example.com/nolabel');
assertLabelTextEquals("nolabel");
});
it("falls back to full uri if the tail would be empty", () => {
elem.setAttribute('uri', 'http://example.com/');
assertLabelTextEquals('http://example.com/');
});
it("changes the label if the graph updates uri's label", () => {
const g = graph.graph;
elem.setAttribute('uri', 'http://example.com/a');
g.patchObject(g.Uri('http://example.com/a'),
g.Uri('rdfs:label'),
g.Literal('new label'));
assertLabelTextEquals('new label');
});
it("changes the label if the uri changes", (done) => {
elem.setAttribute('uri', 'http://example.com/a');
setTimeout(() => {
elem.setAttribute('uri', 'http://example.com/b');
assertLabelTextEquals('label b');
done();
}, 100);
});
});
describe('type icons', () => {
it("omits icon for unknown type");
it("uses icon uri from graph and shows the icon");
});
describe('rename ui', () => {
it("shows rename button if caller wants");
it("opens dialog when you click rename");
it("shows old label in dialog, ready to be replaced");
it("does nothing if you cancel");
it("patches the graph if you accept a new name");
});
});
mocha.run();
</script>
</body>
</html>
|