Testing helps establish confidence that software behaves as expected and remains maintainable. Unit tests exercise a piece of code and its edge cases; functional tests check behavior users expect. section 13.0
For a component, its API can be treated as a testable unit. Tests can check values set through attributes or JavaScript, and whether the visual state reflects those values. Re-running tests after changes can reveal regressions; coverage reports can highlight untested branches. section 13.1 section 13.2
Testing a slider’s initial value
A test can assert that a slider initialized with value="50" exposes the value 50, reflects it in its attribute, and positions its thumbnail accordingly. section 13.2
Listing 13.4. A single slider test
test('slider get initial value', function () {
assert.equal(slider.value, 50); #1
assert.equal( #2
slider.getAttribute('value'), 50);
assert.equal(slider.root.querySelector('.thumb').style.left, sliderWidth *
50/100 - thumbCenterOffset + 'px'); #3
});
See the complete initial-value test, including assertions for the slider’s API, attribute, and thumbnail position. section 13.2
Web Component Tester (WCT) runs browser-based tests with Mocha and Chai. DOM-dependent code may need a browser environment: JSDOM is described as lacking Web Components support. section 13.1 section 13.2
