diff --git a/test/spec/picker/element.test.js b/test/spec/picker/element.test.js
index 2a95458..cc7c087 100644
--- a/test/spec/picker/element.test.js
+++ b/test/spec/picker/element.test.js
@@ -30,7 +30,7 @@ describe('element tests', () => {
       basicBeforeEach()
       mockFrenchDataSource()
       picker = new Picker({ dataSource: ALL_EMOJI, locale: 'en' })
-      container = picker.shadowRoot.querySelector('.picker')
+      container = picker.shadowRoot
       document.body.appendChild(picker)
       await tick(20)
     })
@@ -75,9 +75,9 @@ describe('element tests', () => {
       expect(getByRole(container, 'button', { name: /Choose a skin tone/ }).innerHTML)
         .toContain(DEFAULT_SKIN_TONE_EMOJI)
       picker.skinToneEmoji = '👇'
-      expect(getByRole(container, 'button', { name: /Choose a skin tone/ }).innerHTML).toContain('👇')
+      await waitFor(() => expect(getByRole(container, 'button', { name: /Choose a skin tone/ }).innerHTML).toContain('👇'))
       picker.skinToneEmoji = '👋'
-      expect(getByRole(container, 'button', { name: /Choose a skin tone/ }).innerHTML).toContain('👋')
+      await waitFor(() => expect(getByRole(container, 'button', { name: /Choose a skin tone/ }).innerHTML).toContain('👋'))
     })
 
     test('can get the locale/dataSource', () => {
@@ -97,7 +97,7 @@ describe('element tests', () => {
     test('has a default locale/dataSource', async () => {
       const picker = new Picker()
       document.body.appendChild(picker)
-      const container = picker.shadowRoot.querySelector('.picker')
+      const container = picker.shadowRoot
       await tick(20)
 
       await waitFor(() => expect(getByRole(container, 'menuitem', { name: /😀/ })).toBeVisible())
diff --git a/test/spec/picker/errors.test.js b/test/spec/picker/errors.test.js
index 1049055..0f7812c 100644
--- a/test/spec/picker/errors.test.js
+++ b/test/spec/picker/errors.test.js
@@ -28,7 +28,7 @@ describe('errors', () => {
     fetch.head(dataSource, { body: null, status: 500 })
 
     const picker = new Picker({ dataSource })
-    const container = picker.shadowRoot.querySelector('.picker')
+    const container = picker.shadowRoot
     document.body.appendChild(picker)
 
     await tick(20)
@@ -51,7 +51,7 @@ describe('errors', () => {
       { delay: 1500 })
 
     const picker = new Picker({ dataSource })
-    const container = picker.shadowRoot.querySelector('.picker')
+    const container = picker.shadowRoot
     document.body.appendChild(picker)
     await tick(20)
 
diff --git a/test/spec/picker/lifecycle.test.js b/test/spec/picker/lifecycle.test.js
index a242f8f..6087d4b 100644
--- a/test/spec/picker/lifecycle.test.js
+++ b/test/spec/picker/lifecycle.test.js
@@ -10,7 +10,7 @@ describe('lifecycle', () => {
   test('can remove and re-append custom element', async () => {
     mockDefaultDataSource()
     const picker = new Picker()
-    const container = picker.shadowRoot.querySelector('.picker')
+    const container = picker.shadowRoot
 
     document.body.appendChild(picker)
 
@@ -37,7 +37,7 @@ describe('lifecycle', () => {
     mockDefaultDataSource()
     const picker = new Picker()
     document.body.appendChild(picker)
-    const container = picker.shadowRoot.querySelector('.picker')
+    const container = picker.shadowRoot
 
     await waitFor(() => expect(getByRole(container, 'menuitem', { name: /😀/ })).toBeVisible())