Merge pull request #16508 from pahan35/fix/15278-take-args-state-from…

…-url

Core: Fix args values updated from url to control

lib/preview-web/src/PreviewWeb.test.ts

@@ -186,6 +186,16 @@ describe('PreviewWeb', () => {
         foo: 'url',
       });
     });
+    it('updates args from the URL', async () => {
+      document.location.search = '?id=component-one--a&args=foo:url';
+
+      await createAndRenderPreview();
+
+      expect(mockChannel.emit).toHaveBeenCalledWith(Events.STORY_ARGS_UPDATED, {
+        storyId: 'component-one--a',
+        args: { foo: 'url' },
+      });
+    });
 
     it('allows async getProjectAnnotations', async () => {
       const preview = new PreviewWeb();

lib/preview-web/src/PreviewWeb.tsx

@@ -401,14 +401,12 @@ export class PreviewWeb<TFramework extends AnyFramework> {
   // - a story selected in "docs" viewMode,
   //     in which case we render the docsPage for that story
   async renderSelection({ persistedArgs }: { persistedArgs?: Args } = {}) {
-    if (!this.urlStore.selection) {
+    const { selection } = this.urlStore;
+    if (!selection) {
       throw new Error('Cannot render story as no selection was made');
     }
 
-    const {
-      selection,
-      selection: { storyId },
-    } = this.urlStore;
+    const { storyId } = selection;
 
     let story;
     try {
@@ -457,8 +455,11 @@ export class PreviewWeb<TFramework extends AnyFramework> {
         args,
       });
     }
-    // If the implementation changed, the args also may have changed
-    if (implementationChanged) {
+
+    // For v6 mode / compatibility
+    // If the implementation changed, or args were persisted, the args may have changed,
+    // and the STORY_PREPARED event above may not be respected.
+    if (implementationChanged || persistedArgs) {
       this.channel.emit(Events.STORY_ARGS_UPDATED, { storyId, args });
     }