fix: ensure that empty text nodes do not make the label mixin think it is non-empty

Author: iOvergaard

packages/uui-base/lib/mixins/LabelMixin.ts

@@ -47,10 +47,19 @@ export const LabelMixin = <T extends Constructor<LitElement>>(
     @state()
     private _labelSlotHasContent = false;
 
-    private labelSlotChanged(e: any): void {
-      this._labelSlotHasContent =
-        (e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length >
-        0;
+    private labelSlotChanged(e: Event): void {
+      const nodes = (e.target as HTMLSlotElement).assignedNodes();
+
+      if (!nodes.length) {
+        this._labelSlotHasContent = false;
+        return;
+      }
+
+      // If some nodes are not TEXT_NODE, or if one of the nodes is not empty, set the slot as having content
+      this._labelSlotHasContent = nodes.some(
+        node =>
+          node.nodeType !== Node.TEXT_NODE || !!node.textContent?.trim().length,
+      );
     }
 
     /**

packages/uui-button/lib/uui-button.test.ts

@@ -119,6 +119,19 @@ describe('UuiButton', () => {
       const slot = element.shadowRoot!.querySelector('button')!;
       expect(slot).to.exist;
     });
+    it('label property is used when no default slot is provided', async () => {
+      const element = await fixture(
+        html` <uui-button label="My label"> &nbsp; </uui-button>`,
+      );
+      expect(element.shadowRoot?.textContent).to.include('My label');
+    });
+    it('default slot takes precedence over label property', async () => {
+      element.label = 'My label';
+      await elementUpdated(element);
+      const slot = element.shadowRoot!.querySelector('slot')!;
+      expect(slot.assignedNodes().length).to.equal(1);
+      expect(slot.assignedNodes()[0].textContent).to.equal('Hello uui-button');
+    });
   });
 
   describe('events', () => {