fix(clipboard): add area-live to announce copied

shoelace-style · Aug 1, 2023 · 2724570 · 2724570
1 parent edd25a4
commit 2724570
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/src/components/clipboard/clipboard.component.ts b/src/components/clipboard/clipboard.component.ts
@@ -81,6 +81,7 @@ export default class SlClipboard extends ShoelaceElement {
     return html`
       <div
         part="base"
+        aria-live="polite"
         class=${classMap({
           clipboard: true,
           [`clipboard--${this.copyStatus}`]: true

diff --git a/src/components/clipboard/clipboard.test.ts b/src/components/clipboard/clipboard.test.ts
@@ -19,9 +19,9 @@ describe('<sl-clipboard>', () => {
     });
 
     it('should reset copyStatus after 2 seconds', async () => {
-      expect(el.copy).to.be.false;
-      await el.copy();
-      expect(el.copyStatus).to.equal('copied');
+      expect(el.copyStatus).to.equal('trigger');
+      await el.copy(); // this will result in an error as copy needs to always be called from a user action
+      expect(el.copyStatus).to.equal('error');
       await aTimeout(2100);
       expect(el.copyStatus).to.equal('trigger');
     });