@riotjs/compiler - npm Package Compare versions

Comparing version 6.2.0 to 6.3.0

compiler.d.ts

@@ -40,8 +40,11 @@ import {RawSourceMap} from 'source-map'
 
-export type PostProcessorsMap =  Map<string, ProcessorFunction>
+export type PostProcessorsMap = Map<string, ProcessorFunction>
 export type PreProcessorType = 'template' | 'javascript' | 'css'
 
 // public API
-export function generateTemplateFunctionFromString(source: string): string
+export function generateTemplateFunctionFromString(source: string, parserOptions: any): string
+export function generateSlotsFromString(source: string, parserOptions: any): string
+
 export function compile(source: string, options?: CompilerOptions): CompilerOutput
+
 export function registerPreprocessor(
@@ -52,2 +55,3 @@ type: PreProcessorType,
 ): PreProcessorsMap
-export function registerPostprocessor( fn: ProcessorFunction): PostProcessorsMap
+
+export function registerPostprocessor(fn: ProcessorFunction): PostProcessorsMap

package.json

 {
   "name": "@riotjs/compiler",
-  "version": "6.2.0",
+  "version": "6.3.0",
   "description": "Compiler for riot .tag files",
@@ -18,8 +18,9 @@ "main": "dist/index.js",
     "cov-html": "nyc report --reporter=html",
-    "build": "rollup -c build/rollup.node.config.js && rollup -c build/rollup.browser.config.js",
+    "build": "rollup -c build/rollup.node.config.js && rollup -c build/rollup.browser.config.js && rollup -c build/rollup.essential.config.js",
     "postest": "npm run cov-html",
     "test-types": "tsc -p test",
-    "test": "npm run lint && nyc mocha -r esm test/*.spec.js test/**/*.spec.js && npm run test-types",
+    "test-runtime": "karma start test/karma.conf.js",
+    "test": "nyc mocha -r esm test/*.spec.js test/**/*.spec.js && npm run test-types",
     "debug": "mocha --inspect --inspect-brk -r esm test/*.spec.js test/**/*.spec.js",
-    "prepublishOnly": "npm run build && npm run test"
+    "prepublishOnly": "npm run build && npm run lint && npm run test && npm run test-runtime"
   },
@@ -50,2 +51,5 @@ "repository": {
     "esm": "^3.2.25",
+    "karma": "^6.4.0",
+    "karma-chrome-launcher": "^3.1.1",
+    "karma-mocha": "^2.0.1",
     "mocha": "^8.4.0",
@@ -57,2 +61,3 @@ "node-sass": "^7.0.1",
     "rollup-plugin-node-builtins": "^2.1.2",
+    "rollup-plugin-visualizer": "^5.6.0",
     "shelljs": "^0.8.5",
@@ -59,0 +64,0 @@ "typescript": "^4.7.3"

README.md

@@ -96,5 +96,8 @@ [![Build Status][ci-image]][ci-url]
 
-### generateTemplateFunctionFromString(string)
+### generateTemplateFunctionFromString(string, parserOptions)
 #### @returns `string` with the code to execute the @riotjs/bindings `template` function
 
+### generateSlotsFromString(string, parserOptions)
+#### @returns `string` with the code to generate components slots in runtime
+
 [ci-image]:https://img.shields.io/github/workflow/status/riot/compiler/test?style=flat-square
@@ -101,0 +104,0 @@ [ci-url]:https://github.com/riot/compiler/actions

src/generators/template/bindings/tag.js

@@ -80,3 +80,3 @@ import {
  */
-function createSlotsArray(sourceNode, sourceFile, sourceCode) {
+export function createSlotsArray(sourceNode, sourceFile, sourceCode) {
   return builders.arrayExpression([
@@ -83,0 +83,0 @@ ...compose(

src/generators/template/index.js

@@ -1,13 +0,6 @@
-import {BINDING_TYPES, EXPRESSION_TYPES, GET_COMPONENT_FN, TEMPLATE_FN} from './constants'
-import {builders, types} from '../../utils/build-types'
-import {callTemplateFunction, createRootNode} from './utils'
+import {callTemplateFunction, createRootNode, createTemplateDependenciesInjectionWrapper} from './utils'
 import {TAG_TEMPLATE_PROPERTY} from '../../constants'
 import build from './builder'
+import {types} from '../../utils/build-types'
 
-const templateFunctionArguments = [
-  TEMPLATE_FN,
-  EXPRESSION_TYPES,
-  BINDING_TYPES,
-  GET_COMPONENT_FN
-].map(builders.identifier)
 
@@ -43,4 +36,3 @@ /**
       if (path.value.key.name === TAG_TEMPLATE_PROPERTY) {
-        path.value.value = builders.arrowFunctionExpression(
-          templateFunctionArguments,
+        path.value.value = createTemplateDependenciesInjectionWrapper(
           createTemplateFunctionContent(sourceNode, sourceFile, sourceCode)
@@ -47,0 +39,0 @@ )

src/generators/template/utils.js

@@ -5,4 +5,4 @@ import {
   BINDING_SELECTOR_PREFIX,
-  BINDING_TEMPLATE_KEY,
-  EACH_DIRECTIVE,
+  BINDING_TEMPLATE_KEY, BINDING_TYPES,
+  EACH_DIRECTIVE, EXPRESSION_TYPES, GET_COMPONENT_FN,
   IF_DIRECTIVE,
@@ -290,2 +290,17 @@ IS_BOOLEAN_ATTRIBUTE,
 /**
+ * Create the template wrapper function injecting the dependencies needed to render the component html
+ * @param {Array<AST.Nodes>|AST.BlockStatement} body - function body
+ * @returns {AST.Node} arrow function expression
+ */
+export const createTemplateDependenciesInjectionWrapper = (body) => builders.arrowFunctionExpression(
+  [
+    TEMPLATE_FN,
+    EXPRESSION_TYPES,
+    BINDING_TYPES,
+    GET_COMPONENT_FN
+  ].map(builders.identifier),
+  body
+)
+
+/**
  * Convert any DOM attribute into a valid DOM selector useful for the querySelector API
@@ -292,0 +307,0 @@ * @param   { string } attributeName - name of the attribute to query

src/index.js

 import {TAG_CSS_PROPERTY, TAG_LOGIC_PROPERTY, TAG_NAME_PROPERTY, TAG_TEMPLATE_PROPERTY} from './constants'
+import {callTemplateFunction, createTemplateDependenciesInjectionWrapper} from './generators/template/utils'
 import {nullNode, simplePropertyNode} from './utils/custom-ast-nodes'
@@ -7,4 +8,4 @@ import {register as registerPostproc, execute as runPostprocessors} from './postprocessors'
 import {builders} from './utils/build-types'
-import {callTemplateFunction} from './generators/template/utils'
 import compose from 'cumpa'
+import {createSlotsArray} from './generators/template/bindings/tag'
 import cssGenerator from './generators/css'
@@ -98,10 +99,34 @@ import curry from 'curri'
 /**
+ * Parse a string to simply get its template AST
+ * @param { string } source - string to parse
+ * @param { Object } options - parser options
+ * @returns {Object} riot parser template output
+ */
+const parseSimpleString = (source, options) => {
+  const { parse } = riotParser(options)
+  return parse(source).output.template
+}
+
+/**
+ * Generate the component slots creation function from the root node
+ * @param { string } source - component outer html
+ * @param { Object } parserOptions - riot parser options
+ * @returns { string } content of the function that can be used to crate the slots in runtime
+ */
+export function generateSlotsFromString(source, parserOptions) {
+  return compose(
+    ({ code }) => code,
+    generateJavascript,
+    createTemplateDependenciesInjectionWrapper,
+    createSlotsArray
+  )(parseSimpleString(source, parserOptions))
+}
+
+/**
  * Generate the Riot.js binding template function from a template string
  * @param { string } source - template string
+ * @param { Object } parserOptions - riot parser options
  * @returns { string } Riot.js bindings template function generated
  */
-export function generateTemplateFunctionFromString(source) {
-  const { parse } = riotParser()
-  const { template } = parse(source).output
-
+export function generateTemplateFunctionFromString(source, parserOptions) {
   return compose(
@@ -111,3 +136,9 @@ ({ code }) => code,
     callTemplateFunction
-  )(...build(template, DEFAULT_OPTIONS.file, source))
+  )(
+    ...build(
+      parseSimpleString(source, parserOptions),
+      DEFAULT_OPTIONS.file,
+      source
+    )
+  )
 }
@@ -114,0 +145,0 @@

src/utils/ast-nodes-checks.js

@@ -1,6 +0,6 @@
-import globalScope from 'globals'
+import {builtin} from 'globals/globals.json'
 import {namedTypes} from './build-types'
 
 const browserAPIs = ['window', 'document', 'console']
-const builtinAPIs = Object.keys(globalScope.builtin)
+const builtinAPIs = Object.keys(builtin)
 
@@ -7,0 +7,0 @@ export const isIdentifier = n => namedTypes.Identifier.check(n)

src/utils/build-types.js

@@ -5,2 +5,2 @@ import {types as astTypes} from 'recast'
 export const builders = astTypes.builders
-export const namedTypes = astTypes.namedTypes
+export const namedTypes = astTypes.namedTypes

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

High entropy strings

Supply chain risk

Contains high entropy strings. This could be a sign of encrypted data, leaked secrets or obfuscated code.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3300906

increased by58.6%

Number of package files

58

increased by9.43%

Lines of code

86615

increased by53.25%

Number of lines in readme file

113

increased by2.73%

Worsened metrics

Dev dependency count

23

increased by21.05%

Number of low supply chain risk alerts

8

increased byInfinity%

No dependency changes