Skip to content

Commit

Permalink
fix(shaker): typescript enums support (#761) (#764)
Browse files Browse the repository at this point in the history
  • Loading branch information
Anber authored May 31, 2021
1 parent 20e1ba5 commit 6907e22
Show file tree
Hide file tree
Showing 9 changed files with 158 additions and 119 deletions.
3 changes: 3 additions & 0 deletions packages/babel/__fixtures__/enums.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export enum Colors {
BLUE = '#27509A',
}
91 changes: 60 additions & 31 deletions packages/babel/__tests__/depsGraph.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,11 @@ describe('VariableDeclaration', () => {
const deps = graph.getDependenciesByBinding('0:a');
expect(deps).toMatchObject([
{
type: 'NumericLiteral',
value: 42,
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'NumericLiteral',
value: 42,
},
]);

Expand All @@ -52,11 +52,11 @@ describe('scopes', () => {
const deps0 = graph.getDependenciesByBinding('0:a');
expect(deps0).toMatchObject([
{
type: 'NumericLiteral',
value: 42,
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'NumericLiteral',
value: 42,
},
{
type: 'Identifier',
Expand All @@ -67,22 +67,22 @@ describe('scopes', () => {
start: 35,
},
{
type: 'NumericLiteral',
value: 21,
type: 'AssignmentExpression',
},
{
type: 'AssignmentExpression',
type: 'NumericLiteral',
value: 21,
},
]);

const deps1 = graph.getDependenciesByBinding('1:a');
expect(deps1).toMatchObject([
{
type: 'StringLiteral',
value: '21',
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'StringLiteral',
value: '21',
},
]);

Expand All @@ -97,14 +97,14 @@ describe('scopes', () => {
const aDeps = graph.getDependenciesByBinding('0:a');
expect(aDeps).toMatchObject([
{
type: 'ArrowFunctionExpression',
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'ArrowFunctionExpression',
},
]);

expect(graph.getDependenciesByBinding('1:arg1')).toHaveLength(1);
expect(graph.getDependenciesByBinding('1:arg1')).toHaveLength(3);
expect(graph.getDependentsByBinding('1:arg1')).toMatchObject([
{
// arg1 in the binary expression
Expand All @@ -129,19 +129,33 @@ describe('scopes', () => {
]);

expect(graph.getDependenciesByBinding('1:arg2')).toMatchObject([
{
type: 'ArrowFunctionExpression',
},
{
type: 'Identifier',
name: 'arg2',
start: 17,
},
{
type: 'BinaryExpression',
start: 32,
},
]);

expect(graph.getDependenciesByBinding('1:arg3')).toMatchObject([
{
type: 'ArrowFunctionExpression',
},
{
type: 'Identifier',
name: 'arg3',
start: 23,
},
{
type: 'BinaryExpression',
start: 32,
},
]);
});
});
Expand All @@ -156,11 +170,11 @@ describe('AssignmentExpression', () => {
const deps = graph.getDependenciesByBinding('0:a');
expect(deps).toMatchObject([
{
type: 'NumericLiteral',
value: 42,
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'NumericLiteral',
value: 42,
},
{
type: 'Identifier',
Expand All @@ -173,11 +187,11 @@ describe('AssignmentExpression', () => {
start: 12,
},
{
type: 'NumericLiteral',
value: 24,
type: 'AssignmentExpression',
},
{
type: 'AssignmentExpression',
type: 'NumericLiteral',
value: 24,
},
]);

Expand All @@ -193,11 +207,11 @@ describe('AssignmentExpression', () => {

expect(graph.getDependenciesByBinding('0:a')).toMatchObject([
{
type: 'ObjectExpression',
properties: [],
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'ObjectExpression',
properties: [],
},
{
type: 'Identifier',
Expand Down Expand Up @@ -242,6 +256,12 @@ it('SequenceExpression', () => {
{
type: 'ArrowFunctionExpression',
},
{
id: {
name: 'color2',
},
type: 'VariableDeclarator',
},
]);

const fnDeps = graph.findDependencies({
Expand All @@ -260,16 +280,19 @@ it('SequenceExpression', () => {
name: 'local',
type: 'Identifier',
},
{
type: 'SequenceExpression',
},
]);

const localDeps = graph.getDependenciesByBinding('0:local');
expect(localDeps).toMatchObject([
{
type: 'StringLiteral',
value: '',
type: 'VariableDeclarator',
},
{
type: 'VariableDeclarator',
type: 'StringLiteral',
value: '',
},
{
type: 'Identifier',
Expand All @@ -282,11 +305,11 @@ it('SequenceExpression', () => {
start: 61,
},
{
type: 'Identifier',
name: 'color1',
type: 'AssignmentExpression',
},
{
type: 'AssignmentExpression',
type: 'Identifier',
name: 'color1',
},
{
type: 'Identifier',
Expand All @@ -300,7 +323,7 @@ it('SequenceExpression', () => {

const bool = { type: 'BooleanLiteral' };
expect(graph.findDependents(bool)).toHaveLength(0);
expect(graph.findDependencies(bool)).toHaveLength(0);
expect(graph.findDependencies(bool)).toHaveLength(1);
});

it('MemberExpression', () => {
Expand All @@ -323,5 +346,11 @@ it('MemberExpression', () => {
type: 'Identifier',
name: 'key',
},
{
type: 'VariableDeclarator',
id: {
name: 'blue',
},
},
]);
});
17 changes: 7 additions & 10 deletions packages/babel/__utils__/strategy-tester.ts
Original file line number Diff line number Diff line change
Expand Up @@ -77,8 +77,8 @@ export function run(
conf: (original: typeof babelrc) => typeof babelrc = (i) => i
) => {
const { code, metadata } = await transformAsync(input, {
...conf(babelrc),
filename: join(dirname, 'source.js'),
...conf(babelrc),
});
// The slug will be machine specific, so replace it with a consistent one
return {
Expand Down Expand Up @@ -179,23 +179,20 @@ export function run(
expect(metadata).toMatchSnapshot();
});

it('evaluates typescript enums', async () => {
it('evaluates imported typescript enums', async () => {
const { code, metadata } = await transpile(
dedent`
enum Colors {
BLUE = '#27509A'
}
import { styled } from '@linaria/react';
import { Colors } from '@linaria/babel-preset/__fixtures__/enums';
const Title = styled.h1\`
export const Title = styled.h1\`
color: ${'${Colors.BLUE}'};
\`;
`,
(config) => ({
...config,
plugins: [
'@babel/plugin-transform-typescript',
...(config.plugins || []),
],
presets: ['@babel/preset-typescript', ...(config.presets ?? [])],
filename: 'source.ts',
})
);

Expand Down
3 changes: 2 additions & 1 deletion packages/babel/src/extract.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import type { Node, Program, Expression } from '@babel/types';
import type { NodePath, Scope, Visitor } from '@babel/traverse';
import { expression, statement } from '@babel/template';
import generator from '@babel/generator';
import { debug } from '@linaria/logger';
import { debug, error } from '@linaria/logger';
import evaluate from './evaluators';
import getTemplateProcessor from './evaluators/templateProcessor';
import Module from './module';
Expand Down Expand Up @@ -185,6 +185,7 @@ export default function extract(
lazyValues = evaluation.value.__linariaPreval || [];
debug('lazy-deps:values', evaluation.value.__linariaPreval);
} catch (e) {
error('lazy-deps:evaluate', code);
throw new Error(
'An unexpected runtime error occurred during dependencies evaluation: \n' +
e.stack +
Expand Down
35 changes: 21 additions & 14 deletions packages/extractor/__tests__/__snapshots__/extractor.test.ts.snap
Original file line number Diff line number Diff line change
Expand Up @@ -336,6 +336,27 @@ Dependencies: NA
`;
exports[`extractor evaluates imported typescript enums 1`] = `
"import { styled } from '@linaria/react';
import { Colors } from '@linaria/babel-preset/__fixtures__/enums';
export const Title = /*#__PURE__*/styled(\\"h1\\")({
name: \\"Title\\",
class: \\"Title_taxxqrn\\"
});"
`;
exports[`extractor evaluates imported typescript enums 2`] = `
CSS:
.Title_taxxqrn {
color: #27509A;
}
Dependencies: @linaria/babel-preset/__fixtures__/enums
`;
exports[`extractor evaluates interpolations with sequence expression 1`] = `
"import { styled } from '@linaria/react';
export const Title = /*#__PURE__*/styled(\\"h1\\")({
Expand Down Expand Up @@ -415,20 +436,6 @@ Dependencies: @linaria/babel-preset/__fixtures__/slugify
`;
exports[`extractor evaluates typescript enums 1`] = `
"var Colors;
(function (Colors) {
Colors[\\"BLUE\\"] = \\"#27509A\\";
})(Colors || (Colors = {}));
const Title = styled.h1\`
color: \${Colors.BLUE};
\`;"
`;
exports[`extractor evaluates typescript enums 2`] = `Object {}`;
exports[`extractor generates stable class names 1`] = `
"import { styled } from '@linaria/react';
export const T1 = /*#__PURE__*/styled(\\"h1\\")({
Expand Down
Loading

0 comments on commit 6907e22

Please sign in to comment.