skinny-widgets
Version:
skinnable web components widgets collection
94 lines (76 loc) • 2.83 kB
HTML
<html>
<head>
<meta charset="utf-8">
<script src="../node_modules/mocha/mocha.js"></script>
<script src="../node_modules/chai/chai.js"></script>
<script src="../node_modules/sinon/pkg/sinon.js"></script>
<script src="../node_modules/wct-mocha/wct-mocha.js"></script>
</head>
<body>
<sk-config
theme="antd"
base-path="../src"
lang="ru"
id="skConfig"
></sk-config>
<sk-checkbox base-path="../src" id="skCheckbox"></sk-checkbox>
<sk-checkbox base-path="../src" id="skCheckbox2">
<template id="SkCheckboxTpl">
<input type="checkbox" value="" />
<div id="skCheckbox2Internal">SkCheckbox2</div>
</template>
</sk-checkbox>
<script type="module">
import { whenSkRendered } from '../node_modules/sk-core/src/rd-util.js';
import { SkConfig } from '../node_modules/sk-core/src/sk-config.js';
import { SkCheckbox } from '../node_modules/sk-checkbox/src/sk-checkbox.js';
customElements.define('sk-config', SkConfig);
customElements.define('sk-checkbox', SkCheckbox);
suite('<sk-checkbox>', () => {
suiteSetup(() => {
});
test('is sk-checkbox rendered', (done) => {
const element = document.getElementById('skCheckbox');
element.whenRendered(() => {
chai.assert.instanceOf(element, SkCheckbox);
done();
});
});
test('is sk-checkbox disabled', (done) => {
let element = document.getElementById('skCheckbox');
element.whenRendered(() => {
element.setAttribute('disabled', 'disabled');
let inputEl = element.shadowRoot.querySelector('input');
chai.assert(inputEl.getAttribute('disabled'));
element.removeAttribute('disabled');
done();
});
});
test('is sk-checkbox checked after clicked', (done) => {
let element = document.getElementById('skCheckbox');
let doAssert = () => {
element.click();
let inputEl = element.shadowRoot.querySelector('input');
chai.assert(inputEl.hasAttribute('checked'));
done();
};
element.whenRendered(() => {
doAssert();
});
});
test('is sk-checkbox2 templated', (done) => {
let element = document.getElementById('skCheckbox2');
let doAssert = () => {
let el = element.shadowRoot.querySelector('#skCheckbox2Internal');
chai.assert(el.innerHTML === 'SkCheckbox2');
done();
};
element.whenRendered(() => {
doAssert();
});
});
});
</script>
</body>
</html>