feat(tabs): add test coverage, remove unused property from component …

…class
adobe · Feb 16, 2023 · 9933ad8 · 9933ad8
1 parent d104b52
commit 9933ad8
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/packages/tabs/src/TabsOverflow.ts b/packages/tabs/src/TabsOverflow.ts
@@ -11,7 +11,6 @@ governing permissions and limitations under the License.
 */
 import {
     CSSResultArray,
-    ElementSize,
     html,
     PropertyValues,
     SizedMixin,
@@ -72,14 +71,12 @@ export class TabsOverflow extends SizedMixin(SpectrumElement) {
         super.firstUpdated(changes);
         // enable scroll event
         this.scrollContent[0]?.setAttribute('enableTabsScroll', '');
-        this.size = (this.scrollContent[0]?.getAttribute('size') ||
-            'm') as ElementSize;
         this.resizeController.observe(this.overflowContainer);
     }
 
     private async _handleSlotChange(): Promise<void> {
         const [tabsElement] = this.scrollContent;
-        await tabsElement.updateComplete;
+        await tabsElement?.updateComplete;
         this._updateScrollState();
     }
 
@@ -107,7 +104,7 @@ export class TabsOverflow extends SizedMixin(SpectrumElement) {
         const [tabsElement] = this.scrollContent;
 
         const dist = tabsElement.clientWidth * 0.5;
-        const left = currentTarget?.classList?.contains('left-scroll')
+        const left = currentTarget.classList.contains('left-scroll')
             ? -dist
             : dist;
         tabsElement.scrollTabs(left, 'smooth');

diff --git a/packages/tabs/test/tabs-overflow.test.ts b/packages/tabs/test/tabs-overflow.test.ts
@@ -130,17 +130,32 @@ describe('TabsOverflow', () => {
             '.right-scroll'
         ) as ActionButton;
 
-        leftButton.click();
+        leftButton.dispatchEvent(new Event('click', {}));
 
         const tabsEl = spTabsOverflows.querySelector('sp-tab') as Tab;
         const initialLeft = tabsEl.getBoundingClientRect().left;
-        rightButton.click();
+        rightButton.dispatchEvent(new Event('click', {}));
         await elementUpdated(el);
-        rightButton.click();
+        rightButton.dispatchEvent(new Event('click', {}));
         await elementUpdated(el);
-        rightButton.click();
+        rightButton.dispatchEvent(new Event('click', {}));
         await elementUpdated(el);
         const finalLeft = tabsEl.getBoundingClientRect().left;
         expect(finalLeft).to.be.lessThanOrEqual(initialLeft);
     });
+
+    it('should fail properly if slot is not sp-tabs', async () => {
+        const el = await fixture<TabsOverflow>(
+            html`
+                <sp-tabs-overflow>
+                    <div>Some div</div>
+                </sp-tabs-overflow>
+            `
+        );
+
+        await elementUpdated(el);
+        const slot = el.shadowRoot.querySelector('slot');
+        const slotContent = slot?.assignedElements() || '';
+        expect(slotContent[0].toString()).to.not.contains('Tabs');
+    });
 });