fix: update aria-labelledby when restoring default label (#6085) (#6088)

Co-authored-by: Serhii Kulykov <iamkulykov@gmail.com>

Author: vaadin-bot

packages/component-base/src/slot-child-observe-controller.js

@@ -169,7 +169,7 @@ export class SlotChildObserveController extends SlotController {
   __updateNodeId(node) {
     // When in multiple mode, only set ID attribute on the element in default slot.
     const isFirstNode = !this.nodes || node === this.nodes[0];
-    if (node.nodeType === Node.ELEMENT_NODE && isFirstNode && !node.id) {
+    if (node.nodeType === Node.ELEMENT_NODE && (!this.multiple || isFirstNode) && !node.id) {
       node.id = this.defaultId;
     }
   }

packages/field-base/test/field-mixin.test.js

@@ -774,7 +774,7 @@ const runTests = (defineHelper, baseMixin) => {
   describe('slotted label', () => {
     beforeEach(async () => {
       element = fixtureSync(`
-        <${tag}>
+        <${tag} label="Default">
           <label slot="label">Label</label>
           <input slot="input">
         </${tag}>
@@ -789,6 +789,15 @@ const runTests = (defineHelper, baseMixin) => {
       expect(aria).to.be.ok;
       expect(aria).to.equal(label.id);
     });
+
+    it('should restore aria-labelledby when removing slotted label', async () => {
+      label.remove();
+      await nextRender();
+      const defaultLabel = element.querySelector('[slot=label]');
+      const aria = input.getAttribute('aria-labelledby');
+      expect(aria).to.be.ok;
+      expect(aria).to.equal(defaultLabel.id);
+    });
   });
 
   describe('aria-required', () => {