widget.setProperties({
checked: true,
describedBy: 'foo',
name: 'bar',
value: 'baz'
});
const expectedVdom = expected(widget);
assignChildProperties(expectedVdom, '0,0', {
checked: true,
'aria-describedby': 'foo',
name: 'bar',
value: 'baz'
});
assignProperties(expectedVdom, {
classes: [ css.root, null, css.checked, null, null, null, null, null, null ]
});
widget.expectRender(expectedVdom);
},
'label'() {
widget.setProperties({
label: 'foo'
});
widget.expectRender(expected(widget, true));
},
'state classes'() {
widget.setProperties({
tests: {
'default properties'() {
widget.setProperties(props());
widget.expectRender(expected(widget));
},
'custom properties'() {
widget.setProperties(props({
closeable: true,
disabled: true
}));
widget.setChildren(testChildren);
const expectedVdom = expected(widget, true, [...testChildren]);
assignProperties(expectedVdom, {
'aria-disabled': 'true',
classes: [ css.tabButton, null, css.disabledTabButton ]
});
widget.expectRender(expectedVdom);
},
'active tab'() {
widget.setProperties(props({
active: true
}));
let expectedVdom = expected(widget);
assignProperties(expectedVdom, {
'aria-selected': 'true',
classes: [ css.tabButton, css.activeTabButton, null ],
tabIndex: 0
});
widget.expectRender(expectedVdom, 'Selected tab render without close button');
assert.isFalse(isOpen(widget), 'widget is closed after escape key press');
},
'listbox onActiveIndexChange'() {
widget.setProperties(testProperties);
let expected = getExpectedVdom(widget, true, true, true);
// open dropdown
widget.sendEvent('click', { selector: `.${css.trigger}` });
widget.callListener('onActiveIndexChange', {
args: [ 1 ],
key: 'listbox'
});
expected = getExpectedVdom(widget, true, true, true);
assignProperties(findKey(expected, 'listbox')!, { activeIndex: 1 });
widget.expectRender(expected);
},
'keyboard navigates options'() {
const preventDefault = sinon.stub();
const expected = getExpectedVdom(widget, true, true, true);
widget.setProperties({
...testProperties,
label: undefined
});
// open dropdown
widget.sendEvent('click', { selector: `.${css.trigger}` });