diff --git a/src/generators/dom/visitors/Element.js b/src/generators/dom/visitors/Element.js index f648a3caf9..21da9897b7 100644 --- a/src/generators/dom/visitors/Element.js +++ b/src/generators/dom/visitors/Element.js @@ -79,12 +79,10 @@ export default { } // special case – bound + + + + +

selected: two, three

+ `, + + test ( assert, component, target, window ) { + const select = target.querySelector( 'select' ); + const options = [ ...target.querySelectorAll( 'option' ) ]; + + const change = new window.Event( 'change' ); + + options[1].selected = false; + select.dispatchEvent( change ); + + assert.deepEqual( component.get( 'selected' ), [ 'three' ] ); + assert.htmlEqual( target.innerHTML, ` + + +

selected: three

+ ` ); + + options[0].selected = true; + select.dispatchEvent( change ); + + assert.deepEqual( component.get( 'selected' ), [ 'one', 'three' ] ); + assert.htmlEqual( target.innerHTML, ` + + +

selected: one, three

+ ` ); + + component.set({ selected: [ 'one', 'two' ] }); + + assert.ok( options[0].selected ); + assert.ok( options[1].selected ); + assert.ok( !options[2].selected ); + + assert.htmlEqual( target.innerHTML, ` + + +

selected: one, two

+ ` ); + } +}; diff --git a/test/generator/binding-select-multiple/main.html b/test/generator/binding-select-multiple/main.html new file mode 100644 index 0000000000..dc221c13e4 --- /dev/null +++ b/test/generator/binding-select-multiple/main.html @@ -0,0 +1,7 @@ + + +

selected: {{selected.join( ', ' )}}