fix(shaker): shaker dropping exports (#1116)

* fix shaker dropping exports

* add space

* add changeset

* fix snapshots for #1116

* docs: add mention to the changset that it fixes #1114

Co-authored-by: Tim Kutnick <tim.kutnick@airbnb.com>
Co-authored-by: Anton Evzhakov <anton@evz.name>

.changeset/eight-steaks-rhyme.md

@@ -0,0 +1,6 @@
+---
+'@linaria/shaker': patch
+'@linaria/testkit': patch
+---
+
+Fix @linaria/shaker from removing exported renamed imports. Fixes #1114.

packages/shaker/src/plugins/shaker-plugin.ts

@@ -38,6 +38,10 @@ export interface IMetadata {
   __linariaShaker: IShakerMetadata;
 }
 
+interface NodeWithName {
+  name: string;
+}
+
 export const hasShakerMetadata = (
   metadata: object | undefined
 ): metadata is IMetadata =>
@@ -196,9 +200,15 @@ export default function shakerPlugin(
 
       if (!onlyExports.includes('*')) {
         const aliveExports = new Set<IExport | IReexport>();
+        const importNames = collected.imports.map(({ imported }) => imported);
+
         exports.forEach((exp) => {
           if (onlyExports.includes(exp.exported)) {
             aliveExports.add(exp);
+          } else if (
+            importNames.includes((exp.local.node as NodeWithName).name || '')
+          ) {
+            aliveExports.add(exp);
           }
         });
 

packages/testkit/src/__fixtures__/foo.js

@@ -1,2 +1,3 @@
 export const foo1 = "foo1";
 export const foo2 = "foo2";
+export const foo3 = () => 'foo3';

packages/testkit/src/__snapshots__/babel.test.ts.snap

@@ -1819,6 +1819,24 @@ Dependencies: ./__fixtures__/complex-component
 
 `;
 
+exports[`strategy shaker should not drop exported vars of renamed imports 1`] = `
+"import { foo3 } from \\"./__fixtures__/reexports\\";
+export const bar3 = foo3;
+export const square = \\"square_s13jq05\\";"
+`;
+
+exports[`strategy shaker should not drop exported vars of renamed imports 2`] = `
+
+CSS:
+
+.square_s13jq05 {
+  color: foo3;
+}
+
+Dependencies: ./__fixtures__/reexports
+
+`;
+
 exports[`strategy shaker should process \`css\` calls inside components 1`] = `
 "import React from 'react';
 export function Component() {

packages/testkit/src/babel.test.ts

@@ -2448,6 +2448,25 @@ describe('strategy shaker', () => {
     expect(metadata).toMatchSnapshot();
   });
 
+  it('should not drop exported vars of renamed imports', async () => {
+    const { code, metadata } = await transform(
+      dedent`
+      import { css } from "@linaria/core";
+      import { foo3 } from "./__fixtures__/reexports";
+
+      export const bar3 = foo3;
+
+      export const square = css\`
+        color: ${'${bar3("thing")}'};
+      \`;
+    `,
+      [evaluator]
+    );
+
+    expect(code).toMatchSnapshot();
+    expect(metadata).toMatchSnapshot();
+  });
+
   it('should interpolate imported components', async () => {
     const { code, metadata } = await transform(
       dedent`