wcs-microdata
Version:
Web component mixin to support microdata properties.
126 lines (95 loc) • 3.75 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
<title>wcs-microdata test</title>
<script src="../../@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
<script src="../../wct-browser-legacy/browser.js"></script>
<script type="module" src="./test-microdata.js"></script>
<script type="module" src="./test-microdata-with-simple-array-type.js"></script>
</head>
<body>
<test-fixture id="SimpleMicrodataTestFixture">
<template>
<test-microdata itemscope prop="normal-prop">
<p itemprop="name" id="itemprop">simple-test</p>
<p itemprop="undeclared">should-not-set</p>
</test-microdata>
</template>
</test-fixture>
<test-fixture id="ArrayMicrodataTestFixture">
<template>
<test-microdata itemscope>
<p itemprop="array">array-value1</p>
<p itemprop="array">array-value2</p>
</test-microdata>
</template>
</test-fixture>
<test-fixture id="SingleArrayMicrodataTestFixture">
<template>
<test-microdata itemscope>
<p itemprop="array">array-value</p>
</test-microdata>
</template>
</test-fixture>
<test-fixture id="SimpleArrayTypeMicrodataTestFixture">
<template>
<test-microdata-with-simple-array-type itemscope>
<p itemprop="array">array-value</p>
</test-microdata-with-simple-array-type>
</template>
</test-fixture>
<script type="module">
import './test-microdata.js';
import './test-microdata-with-simple-array-type.js';
suite('wcs-microdata', () => {
test('does not delete normal custom element properties', () => {
const element = fixture('SimpleMicrodataTestFixture');
assert.equal(element.prop, 'normal-prop');
});
test('sets simple microdata property', () => {
const element = fixture('SimpleMicrodataTestFixture');
assert.equal(element.name, 'simple-test');
});
test('hides properties undeclared in element', () => {
const element = fixture('SimpleMicrodataTestFixture');
assert.isNotOk(element.undeclared);
});
test('displays simple microdata property', () => {
const element = fixture('SimpleMicrodataTestFixture');
flush(() => {
console.log(element.shadowRoot)
const name = element.shadowRoot.getElementById('name');
assert.equal(name.innerHTML, 'simple-test');
done();
});
});
test('sets array-typed properties', () => {
const element = fixture('ArrayMicrodataTestFixture');
assert.deepEqual(element.array, ['array-value1', 'array-value2']);
});
test('converts single value to array for array-typed properties', () => {
const element = fixture('SingleArrayMicrodataTestFixture');
assert.isOk(Array.isArray(element.array));
});
test('converts single value to array for simple array-typed properties', () => {
const element = fixture('SimpleArrayTypeMicrodataTestFixture');
assert.isOk(Array.isArray(element.array));
});
test('updates microdata properties', () => {
const element = fixture('SimpleMicrodataTestFixture');
element.querySelector('#itemprop').textContent = 'modified-property';
element.performUpdate();
assert.equal(element.name, 'modified-property');
});
test('updates element content on microdata properties change', () => {
const element = fixture('SimpleMicrodataTestFixture');
element.querySelector('#itemprop').textContent = 'modified-property';
element.performUpdate();
assert.equal(element.shadowRoot.textContent, 'modified-property');
});
});
</script>
</body>
</html>