fix(ld-select): ld-select not opening up on mobile safari

Resolves #122
emdgroup-liquid · Nov 22, 2021 · 5762271 · 5762271
1 parent 0ef3706
commit 5762271
Show file tree

Hide file tree

Showing 2 changed files with 1 addition and 8 deletions.
diff --git a/src/liquid/components/ld-select/ld-select.tsx b/src/liquid/components/ld-select/ld-select.tsx
@@ -762,11 +762,6 @@ export class LdSelect implements InnerFocusable {
     ) {
       this.expanded = false
     }
-
-    if (ev.target.closest('ld-label')?.querySelector('ld-select') === this.el) {
-      ev.preventDefault()
-      this.triggerRef.focus()
-    }
   }
 
   // Mobile Safari in some cases does not react to click events on elements

diff --git a/src/liquid/components/ld-select/test/ld-select.spec.ts b/src/liquid/components/ld-select/test/ld-select.spec.ts
@@ -1790,14 +1790,12 @@ describe('ld-select', () => {
       '.ld-select__btn-trigger'
     )
     expect(btnTrigger.getAttribute('aria-expanded')).toEqual('true')
-
-    const spyFocusBtnTrigger = jest.spyOn(btnTrigger as HTMLElement, 'focus')
+    ;(btnTrigger as HTMLElement).focus = jest.fn()
 
     ldLabel.dispatchEvent(new Event('touchend', { bubbles: true }))
     await page.waitForChanges()
 
     expect(btnTrigger.getAttribute('aria-expanded')).toEqual('false')
-    expect(spyFocusBtnTrigger).toHaveBeenCalled()
   })
 
   it('displays more indicator with maxRows prop set in multiple mode', async () => {