refactor(transformers): refactor transformers into array of transformation factory

Author: geocine

rollup.ts

@@ -1,7 +1,7 @@
 
 import * as path from 'path';
 import tsTransformer from './transform';
-//import { terser } from 'rollup-plugin-terser';
+// import { terser } from 'rollup-plugin-terser';
 
 const typescript = require('rollup-plugin-typescript2');
 const resolve = require('rollup-plugin-node-resolve');
@@ -13,7 +13,7 @@ const bundleOptions = {
  plugins: [
  typescript({
  transformers: [service => ({
- before: [ tsTransformer(service.getProgram()) ],
+ before: [[],...tsTransformer(service.getProgram())],
  after: []
  })],
  useTsconfigDeclarationDir: true,

transform.ts

@@ -1,34 +1,19 @@
 // TODO: figuire out how to use this on rollup.config.js
 import * as ts from 'typescript';
 
-export default function transformer(program: ts.Program): ts.TransformerFactory<ts.SourceFile> {
- return (context: ts.TransformationContext) => (file: ts.SourceFile) => changeTransform(program, context, file);
+export default function transformer(program: ts.Program): Array<ts.TransformerFactory<ts.SourceFile>> {
+ const tsSourceTransformers: Array<ts.TransformerFactory<ts.SourceFile>> = [
+ (context: ts.TransformationContext) => (file: ts.SourceFile) => extendClass(program, context, file),
+ (context: ts.TransformationContext) => (file: ts.SourceFile) => addImports(context, file)
+ ]
+ return tsSourceTransformers;
 }
 
 // Simple transform add extends CustomElement
-export function changeTransform(program: ts.Program, context: ts.TransformationContext, sf: ts.SourceFile) {
+export function extendClass(program: ts.Program, context: ts.TransformationContext, sf: ts.SourceFile) {
  const visitor: ts.Visitor = (node) => {
  // Add CustomHTMLElement to import
  if (!ts.isClassDeclaration(node)) {
- if (ts.isImportDeclaration(node) && isElementImport(node, sf)) {
- const { importClause: { namedBindings } } = node
- const { elements } = namedBindings as ts.NamedImports
- 
- const specifiers: Array<ts.ImportSpecifier> = [...elements]
- 
- const hasCustomHTMLElementImport = elements.some(n => n.getText().indexOf('CustomHTMLElement') > -1)
- 
- if (!hasCustomHTMLElementImport) {
- specifiers.push(ts.createImportSpecifier(void 0, ts.createIdentifier('CustomHTMLElement')))
- }
- 
- return ts.createImportDeclaration(
- [],
- node.modifiers,
- ts.createImportClause(void 0, ts.createNamedImports(specifiers)),
- node.moduleSpecifier
- )
- }
  return ts.visitEachChild(node, visitor, context);
  }
 
@@ -67,6 +52,31 @@ export function changeTransform(program: ts.Program, context: ts.TransformationC
  return ts.visitNode(sf, visitor);
 };
 
+export function addImports(context: ts.TransformationContext, sf: ts.SourceFile) {
+ const visitor: ts.Visitor = (node) => {
+ if (ts.isImportDeclaration(node) && isElementImport(node, sf)) {
+ const { importClause: { namedBindings } } = node
+ const { elements } = namedBindings as ts.NamedImports
+ 
+ const specifiers: Array<ts.ImportSpecifier> = [...elements]
+ 
+ const hasCustomHTMLElementImport = elements.some(n => n.getText().indexOf('CustomHTMLElement') > -1)
+ 
+ if (!hasCustomHTMLElementImport) {
+ specifiers.push(ts.createImportSpecifier(void 0, ts.createIdentifier('CustomHTMLElement')))
+ }
+ 
+ return ts.createImportDeclaration(
+ [],
+ node.modifiers,
+ ts.createImportClause(void 0, ts.createNamedImports(specifiers)),
+ node.moduleSpecifier
+ )
+ }
+ return ts.visitEachChild(node, visitor, context);
+ };
+ return ts.visitNode(sf, visitor);
+};
 
 function isElementDecorator(node: ts.Decorator, typeChecker: ts.TypeChecker): boolean {
  if (!ts.isCallExpression(node.expression)) {

tsconfig.json

@@ -15,7 +15,8 @@
  "custom-elements-ts": ["src/custom-element"]
  },
  "removeComments": true,
- "target": "es6"
+ "target": "es6",
+ "sourceMap": true
  },
  "include": [
  "./**/*.ts"