From 9a5dccde24cfb9323b2e107d9abdef8168449e55 Mon Sep 17 00:00:00 2001
From: Benny Powers <web@bennypowers.com>
Date: Sat, 10 Jul 2021 21:31:23 +0300
Subject: [PATCH] fix(addons): webcomponents excludeDecorators

---
 .../web-components/sourceDecorator.test.ts    | 27 +++++++++++++++++++
 .../web-components/sourceDecorator.ts         |  4 ++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts b/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts
index 41f34a9dd6a7..4c2c49851045 100644
--- a/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts
+++ b/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts
@@ -1,4 +1,5 @@
 import { html } from 'lit-html';
+import { styleMap } from 'lit-html/directives/style-map';
 import { addons, StoryContext } from '@storybook/addons';
 import { sourceDecorator } from './sourceDecorator';
 import { SNIPPET_RENDERED } from '../../shared';
@@ -49,6 +50,32 @@ describe('sourceDecorator', () => {
     expect(mockChannel.emit).not.toHaveBeenCalled();
   });
 
+  it('should use the originalStoryFn if excludeDecorators is set', () => {
+    const storyFn = (args: any) => html`<div>args story</div>`;
+    const decoratedStoryFn = (args: any) => html`
+      <div style=${styleMap({ padding: `${25}px`, border: '3px solid red' })}>${storyFn(args)}</div>
+    `;
+    const context = makeContext(
+      'args',
+      {
+        __isArgsStory: true,
+        docs: {
+          source: {
+            excludeDecorators: true,
+          },
+        },
+      },
+      {},
+      { originalStoryFn: storyFn }
+    );
+    sourceDecorator(decoratedStoryFn, context);
+    expect(mockChannel.emit).toHaveBeenCalledWith(
+      SNIPPET_RENDERED,
+      'lit-test--args',
+      '<div>args story</div>'
+    );
+  });
+
   it('allows the snippet output to be modified by transformSource', () => {
     const storyFn = (args: any) => html`<div>args story</div>`;
     const transformSource = (dom: string) => `<p>${dom}</p>`;
diff --git a/addons/docs/src/frameworks/web-components/sourceDecorator.ts b/addons/docs/src/frameworks/web-components/sourceDecorator.ts
index 0b12575db976..d1ab37f8ec2e 100644
--- a/addons/docs/src/frameworks/web-components/sourceDecorator.ts
+++ b/addons/docs/src/frameworks/web-components/sourceDecorator.ts
@@ -24,7 +24,9 @@ function applyTransformSource(source: string, context: StoryContext): string {
 }
 
 export function sourceDecorator(storyFn: StoryFn, context: StoryContext) {
-  const story = storyFn();
+  const story = context?.parameters.docs?.source?.excludeDecorators
+    ? context.originalStoryFn(context.args)
+    : storyFn();
 
   if (!skipSourceRender(context)) {
     const container = window.document.createElement('div');