@@ -75,11 +75,11 @@ describe(Combobox.metadata.tag, () => {
7575 it ( 'should reflect each option to a menu item' , async ( ) => {
7676 emulateClick ( input ) ;
7777 await elementIsStable ( element ) ;
78- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
79- expect ( items . length ) . toBe ( 3 ) ;
80- expect ( items [ 0 ] . textContent . trim ( ) ) . toBe ( options [ 0 ] . value ) ;
81- expect ( items [ 1 ] . textContent . trim ( ) ) . toBe ( options [ 1 ] . value ) ;
82- expect ( items [ 2 ] . textContent . trim ( ) ) . toBe ( options [ 2 ] . value ) ;
78+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
79+ expect ( menuItems . length ) . toBe ( 3 ) ;
80+ expect ( menuItems [ 0 ] . textContent . trim ( ) ) . toBe ( options [ 0 ] . value ) ;
81+ expect ( menuItems [ 1 ] . textContent . trim ( ) ) . toBe ( options [ 1 ] . value ) ;
82+ expect ( menuItems [ 2 ] . textContent . trim ( ) ) . toBe ( options [ 2 ] . value ) ;
8383 } ) ;
8484
8585 it ( 'should default the dropdown to align bottom center with position-area "bottom span-right" ensure wide selection options span to the right of the input' , async ( ) => {
@@ -107,10 +107,10 @@ describe(Combobox.metadata.tag, () => {
107107 it ( 'should each menu item with the aria role of option' , async ( ) => {
108108 emulateClick ( input ) ;
109109 await elementIsStable ( element ) ;
110- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
111- expect ( items [ 0 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
112- expect ( items [ 1 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
113- expect ( items [ 2 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
110+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
111+ expect ( menuItems [ 0 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
112+ expect ( menuItems [ 1 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
113+ expect ( menuItems [ 2 ] . getAttribute ( 'role' ) ) . toBe ( 'option' ) ;
114114 } ) ;
115115
116116 it ( 'should only show options that partial match the input value' , async ( ) => {
@@ -147,9 +147,9 @@ describe(Combobox.metadata.tag, () => {
147147 await elementIsStable ( element ) ;
148148 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( true ) ;
149149
150- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
151- items [ 0 ] . focus ( ) ;
152- items [ 0 ] . dispatchEvent ( new KeyboardEvent ( 'keydown' , { code : 'Escape' , bubbles : true } ) ) ;
150+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
151+ menuItems [ 0 ] . focus ( ) ;
152+ menuItems [ 0 ] . dispatchEvent ( new KeyboardEvent ( 'keydown' , { code : 'Escape' , bubbles : true } ) ) ;
153153 await elementIsStable ( element ) ;
154154 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( false ) ;
155155 } ) ;
@@ -164,7 +164,7 @@ describe(Combobox.metadata.tag, () => {
164164 } ) ;
165165
166166 it ( 'should focus first option if key arrow down is pressed' , async ( ) => {
167- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
167+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
168168 const dropdown = element . shadowRoot . querySelector < Dropdown > ( Dropdown . metadata . tag ) ;
169169 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( false ) ;
170170 element . dispatchEvent ( new KeyboardEvent ( 'keydown' ) ) ;
@@ -176,8 +176,8 @@ describe(Combobox.metadata.tag, () => {
176176 input . focus ( ) ;
177177 await open ;
178178 element . dispatchEvent ( new KeyboardEvent ( 'keydown' , { code : 'ArrowDown' } ) ) ;
179- expect ( items [ 0 ] . tabIndex ) . toBe ( 0 ) ;
180- expect ( element . shadowRoot . activeElement . tagName ) . toBe ( items [ 0 ] . tagName ) ;
179+ expect ( menuItems [ 0 ] . tabIndex ) . toBe ( 0 ) ;
180+ expect ( element . shadowRoot . activeElement . tagName ) . toBe ( menuItems [ 0 ] . tagName ) ;
181181 } ) ;
182182
183183 it ( 'should hide dropdown on keydown and is a tab event' , async ( ) => {
@@ -209,24 +209,24 @@ describe(Combobox.metadata.tag, () => {
209209 } ) ;
210210
211211 it ( 'should set the input value if a option is clicked' , async ( ) => {
212- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
212+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
213213 const dropdown = element . shadowRoot . querySelector < Dropdown > ( Dropdown . metadata . tag ) ;
214214 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( false ) ;
215215
216216 element . dispatchEvent ( new KeyboardEvent ( 'keydown' ) ) ;
217217 await elementIsStable ( element ) ;
218218 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( true ) ;
219219
220- emulateClick ( items [ 0 ] ) ;
220+ emulateClick ( menuItems [ 0 ] ) ;
221221 expect ( input . value ) . toBe ( 'Option 1' ) ;
222222 } ) ;
223223
224224 it ( 'should show "no results" message if no options are provided' , async ( ) => {
225- const options = element . querySelectorAll ( 'option' ) ;
225+ const allOptions = element . querySelectorAll ( 'option' ) ;
226226 const dropdown = element . shadowRoot . querySelector < Dropdown > ( Dropdown . metadata . tag ) ;
227227 expect ( dropdown . matches ( ':popover-open' ) ) . toBe ( false ) ;
228228
229- options . forEach ( i => i . remove ( ) ) ;
229+ allOptions . forEach ( i => i . remove ( ) ) ;
230230 element . shadowRoot . dispatchEvent ( new Event ( 'slotchange' ) ) ;
231231 element . dispatchEvent ( new KeyboardEvent ( 'keydown' ) ) ;
232232 await elementIsStable ( element ) ;
@@ -270,15 +270,14 @@ describe(Combobox.metadata.tag, () => {
270270 } ) ;
271271
272272 it ( 'should filter out menu items when corresponding option is disabled' , async ( ) => {
273- const items = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
274- expect ( items [ 0 ] . disabled ) . toBe ( false ) ;
273+ const menuItems = element . shadowRoot . querySelectorAll < MenuItem > ( MenuItem . metadata . tag ) ;
274+ expect ( menuItems [ 0 ] . disabled ) . toBe ( false ) ;
275275 options [ 0 ] . disabled = true ;
276276 element . shadowRoot . dispatchEvent ( new Event ( 'slotchange' ) ) ;
277277 await elementIsStable ( element ) ;
278- expect ( items [ 0 ] . disabled ) . toBe ( true ) ;
278+ expect ( menuItems [ 0 ] . disabled ) . toBe ( true ) ;
279279 } ) ;
280280
281- // todo: this should be handled better at runtime
282281 it ( 'should throw when selectAll() is called on datalist combobox without a select element' , async ( ) => {
283282 expect ( ( ) => element . selectAll ( ) ) . toThrow ( ) ;
284283 } ) ;
0 commit comments