refactor: make selected property in ListMixin use sync: true (#8594) (#8601)

Co-authored-by: Serhii Kulykov <[email protected]>

Author: vaadin-bot

packages/a11y-base/src/list-mixin.js

@@ -40,6 +40,7 @@ export const ListMixin = (superClass) =>
           type: Number,
           reflectToAttribute: true,
           notify: true,
+          sync: true,
         },
 
         /**

packages/a11y-base/test/list-mixin.test.js

@@ -774,7 +774,6 @@ const runTests = (defineHelper, baseMixin) => {
 
     it('should reset previously selected item when listbox and items are disabled', async () => {
       list.selected = 3;
-      await nextUpdate(list);
       expect(items[3].selected).to.be.true;
 
       list.disabled = true;
@@ -788,7 +787,6 @@ const runTests = (defineHelper, baseMixin) => {
 
     it('should restore previously selected item when listbox becomes re-enabled', async () => {
       list.selected = 3;
-      await nextUpdate(list);
 
       list.disabled = true;
       items.forEach((item) => {

packages/item/src/vaadin-item-mixin.js

@@ -38,6 +38,7 @@ export const ItemMixin = (superClass) =>
           value: false,
           reflectToAttribute: true,
           observer: '_selectedChanged',
+          sync: true,
         },
 
         /** @private */

packages/select/src/vaadin-select-base-mixin.js

@@ -97,6 +97,7 @@ export const SelectBaseMixin = (superClass) =>
           value: '',
           notify: true,
           observer: '_valueChanged',
+          sync: true,
         },
 
         /**

packages/select/test/select-lit.test.js

@@ -1,3 +1,5 @@
+import '@vaadin/item/vaadin-lit-item.js';
+import '@vaadin/list-box/vaadin-lit-list-box.js';
 import './not-animated-styles.js';
 import '../src/vaadin-lit-select.js';
 import './select.common.js';

packages/select/test/select-polymer.test.js

@@ -1,3 +1,5 @@
+import '@vaadin/item/vaadin-item.js';
+import '@vaadin/list-box/vaadin-list-box.js';
 import './not-animated-styles.js';
 import '../src/vaadin-select.js';
 import './select.common.js';

packages/select/test/select.common.js

@@ -14,8 +14,6 @@ import {
   tab,
 } from '@vaadin/testing-helpers';
 import sinon from 'sinon';
-import '@vaadin/item/vaadin-item.js';
-import '@vaadin/list-box/vaadin-list-box.js';
 import { html, render } from 'lit';
 
 describe('vaadin-select', () => {
@@ -755,7 +753,6 @@ describe('vaadin-select', () => {
 
     beforeEach(async () => {
       select = fixtureSync(`<vaadin-select value="v2"></vaadin-select>`);
-      await nextRender();
       select.renderer = (root) => {
         render(
           html`
@@ -767,8 +764,8 @@ describe('vaadin-select', () => {
           root,
         );
       };
+      await nextRender();
       valueButton = select.querySelector('vaadin-select-value-button');
-      await nextUpdate(select);
       menu = select._menuElement;
     });