export default { html : `
		<p>selected: null</p>

		<select>
			<option value='a'>a</option>
			<option value='b'>b</option>
			<option value='c'>c</option>
		</select>

		<p>selected: null</p>
	` , async test ( { assert , component , target } ) { const select = target . querySelector ( 'select' ) ; const options = [ ... target . querySelectorAll ( 'option' ) ] ; assert . equal ( component . selected , null ) ; assert . equal ( select . value , '' ) ; assert . equal ( select . selectedIndex , - 1 ) ; assert . ok ( ! options [ 0 ] . selected ) ; component . selected = 'a' ; assert . equal ( select . value , 'a' ) ; assert . ok ( options [ 0 ] . selected ) ; assert . htmlEqual ( target . innerHTML , `
			<p>selected: a</p>

			<select>
				<option value='a'>a</option>
				<option value='b'>b</option>
				<option value='c'>c</option>
			</select>

			<p>selected: a</p>
		` ) ; component . selected = 'd' ; assert . equal ( select . value , '' ) ; assert . equal ( select . selectedIndex , - 1 ) ; assert . ok ( ! options [ 0 ] . selected ) ; assert . htmlEqual ( target . innerHTML , `
			<p>selected: d</p>

			<select>
				<option value='a'>a</option>
				<option value='b'>b</option>
				<option value='c'>c</option>
			</select>

			<p>selected: d</p>
		` ) ; } } ;