Merge pull request #94 from czibbelvin/fix-preview-extract

Ensure preview is ready before moving on to extract

src/browser/StorybookPage.ts

@@ -72,34 +72,44 @@ function fetchStoriesFromWindow(): Promise<StorybookStory[]> {
     );
   }
 
-  return storybookPreview.extract().then(() => {
-    // Pick only the properties we need from Storybook's representation of a story.
-    //
-    // This is necessary because Playwright's `page.evaluate` requires return values to be JSON
-    // serializable, so we need to make sure there are no non-serializable things in this object.
-    // There's no telling what Storybook addons people are using, and whether their parameters are
-    // serializable or not.
-    //
-    // See https://github.com/chanzuckerberg/axe-storybook-testing/issues/44 for a bug caused by this.
-    function pickOnlyNecessaryAndSerializableStoryProperties(
-      story: Story,
-    ): StorybookStory {
-      return {
-        id: story.id,
-        name: story.name,
-        title: story.title,
-        parameters: {
-          axe: story.parameters.axe,
-        },
-      };
-    }
-
-    const storyStore = storybookPreview.storyStore as StoryStore<Renderer>;
-
-    return storyStore
-      .raw()
-      .map(pickOnlyNecessaryAndSerializableStoryProperties);
-  });
+  let readyPromise: Promise<void> = Promise.resolve();
+  if (storybookPreview.ready) {
+    readyPromise = storybookPreview.ready();
+  } else {
+    // @ts-expect-error initializationPromise doesn't exist in v8, but it does in v7.
+    readyPromise = storybookPreview.storyStore.initializationPromise;
+  }
+
+  return readyPromise.then(() =>
+    storybookPreview.extract().then(() => {
+      // Pick only the properties we need from Storybook's representation of a story.
+      //
+      // This is necessary because Playwright's `page.evaluate` requires return values to be JSON
+      // serializable, so we need to make sure there are no non-serializable things in this object.
+      // There's no telling what Storybook addons people are using, and whether their parameters are
+      // serializable or not.
+      //
+      // See https://github.com/chanzuckerberg/axe-storybook-testing/issues/44 for a bug caused by this.
+      function pickOnlyNecessaryAndSerializableStoryProperties(
+        story: Story,
+      ): StorybookStory {
+        return {
+          id: story.id,
+          name: story.name,
+          title: story.title,
+          parameters: {
+            axe: story.parameters.axe,
+          },
+        };
+      }
+
+      const storyStore = storybookPreview.storyStore as StoryStore<Renderer>;
+
+      return storyStore
+        .raw()
+        .map(pickOnlyNecessaryAndSerializableStoryProperties);
+    }),
+  );
 }
 
 /**