Skip emitting empty withConfig

Igorbek · Mar 21, 2019 · 0ca9dd8 · 0ca9dd8
1 parent 561ac8d
commit 0ca9dd8
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 24 deletions.
diff --git a/src/__tests__/baselines/minification-only/minify-css-to-use-with-transpilation.ts.baseline b/src/__tests__/baselines/minification-only/minify-css-to-use-with-transpilation.ts.baseline
@@ -47,11 +47,11 @@ TypeScript before transform:
 TypeScript after transform:
 
   declare const styled: any;
-  const Simple = styled.div.withConfig({}) \`width:100%;\`;
-  const Interpolation = styled.div.withConfig({}) \`content:"  \${props => props.text}  ";\`;
-  const SpecialCharacters = styled.div.withConfig({}) \`content:"  \${props => props.text}  ";color:red;\`;
-  const Comment = styled.div.withConfig({}) \`color:red;\`;
-  const Parens = styled.div.withConfig({}) \`&:hover{color:blue;}\`;
+  const Simple = styled.div \`width:100%;\`;
+  const Interpolation = styled.div \`content:"  \${props => props.text}  ";\`;
+  const SpecialCharacters = styled.div \`content:"  \${props => props.text}  ";color:red;\`;
+  const Comment = styled.div \`color:red;\`;
+  const Parens = styled.div \`&:hover{color:blue;}\`;
   export {};
 
 

diff --git a/...__tests__/baselines/minification-only/minify-css-to-use-without-transpilation.ts.baseline b/...__tests__/baselines/minification-only/minify-css-to-use-without-transpilation.ts.baseline
@@ -60,12 +60,12 @@ TypeScript before transform:
 TypeScript after transform:
 
   declare const styled: any;
-  const Simple = styled.div.withConfig({}) \`width:100%;\`;
-  const Interpolation = styled.div.withConfig({}) \`content:"https://test.com/\${props => props.endpoint}";\`;
-  const SpecialCharacters = styled.div.withConfig({}) \`content:"  \${props => props.text}  ";color:red;\`;
-  const Comment = styled.div.withConfig({}) \`width:100%;color:red;\`;
-  const Parens = styled.div.withConfig({}) \`&:hover{color:blue;}color:red;\`;
-  const UrlComments = styled.div.withConfig({}) \`color:red; background:red;border:1px solid green;\`;
+  const Simple = styled.div \`width:100%;\`;
+  const Interpolation = styled.div \`content:"https://test.com/\${props => props.endpoint}";\`;
+  const SpecialCharacters = styled.div \`content:"  \${props => props.text}  ";color:red;\`;
+  const Comment = styled.div \`width:100%;color:red;\`;
+  const Parens = styled.div \`&:hover{color:blue;}color:red;\`;
+  const UrlComments = styled.div \`color:red; background:red;border:1px solid green;\`;
   export {};
 
 

diff --git a/..._/baselines/minification-only/minify-single-line-comments-with-interpolations.ts.baseline b/..._/baselines/minification-only/minify-single-line-comments-with-interpolations.ts.baseline
@@ -75,15 +75,15 @@ TypeScript before transform:
 TypeScript after transform:
 
   declare const styled: any;
-  const Test1 = styled.div.withConfig({}) \`width:100%;//\${'red'}\`;
-  const Test2 = styled.div.withConfig({}) \`width:100%;//\${'red'}\`;
-  const Test3 = styled.div.withConfig({}) \`width:100%;\${'red'};\`;
-  const Test4 = styled.div.withConfig({}) \`width:100%;//\${'red'}\`;
-  const Test5 = styled.div.withConfig({}) \`width:100%;//\${'red'}\${'blue'}\`;
-  const Test6 = styled.div.withConfig({}) \`background:url("https://google.com");width:100%;\${'green'}//\${'red'}\${'blue'}\`;
-  const Test7 = styled.div.withConfig({}) \`background:url("https://google.com");width:\${p => p.props.width};\${'green'}//\${'red'}\${'blue'}\\nheight:\${p => p.props.height};\`;
-  const Test8 = styled.dev.withConfig({}) \`color:/*\${'red'}*/blue;\`;
-  const Test9 = styled.dev.withConfig({}) \`color://\${'red'}\\nblue\`;
+  const Test1 = styled.div \`width:100%;//\${'red'}\`;
+  const Test2 = styled.div \`width:100%;//\${'red'}\`;
+  const Test3 = styled.div \`width:100%;\${'red'};\`;
+  const Test4 = styled.div \`width:100%;//\${'red'}\`;
+  const Test5 = styled.div \`width:100%;//\${'red'}\${'blue'}\`;
+  const Test6 = styled.div \`background:url("https://google.com");width:100%;\${'green'}//\${'red'}\${'blue'}\`;
+  const Test7 = styled.div \`background:url("https://google.com");width:\${p => p.props.width};\${'green'}//\${'red'}\${'blue'}\\nheight:\${p => p.props.height};\`;
+  const Test8 = styled.dev \`color:/*\${'red'}*/blue;\`;
+  const Test9 = styled.dev \`color://\${'red'}\\nblue\`;
   export {};
 
 

diff --git a/src/createTransformer.ts b/src/createTransformer.ts
@@ -197,10 +197,12 @@ export function createTransformer({
                         }                                           
                     }
 
-                    return ts.createCall(
-                        ts.createPropertyAccess(node as ts.Expression, 'withConfig'),
-                        undefined,
-                        [ts.createObjectLiteral(styledConfig)]);
+                    if (styledConfig.length > 0) {
+                        return ts.createCall(
+                            ts.createPropertyAccess(node as ts.Expression, 'withConfig'),
+                            undefined,
+                            [ts.createObjectLiteral(styledConfig)]);
+                    }
                 }
 
                 ts.forEachChild(node, n => {