Skip to content

Adding custom filters/functions inside wingsuit.twing.environment.js, cause storybook to crash (v2.0.0-beta.6) #287

@joachimjusth

Description

@joachimjusth

Describe the bug
When adding a custom filter and/or function inside the file wingsuit.twing.environment.js, storybook is crashing.
On tag 2.0.0-beta.6

To Reproduce
Steps to reproduce the behavior:

  1. Checkout the tag 2.0.0-beta.6 of wingsuit-designsystem/wingsuit
  2. Build the main monorepo
  3. Go to starter-kit/tailwind
  4. Do the yarn install
  5. Add a custom function like written inside the documentation for the v2
  6. Run the command yarn dev:storybook

Expected behavior
Storybook working properly

Additional context
The error is:

Error: Function "functionName" is already registered.
    at TwingExtensionSet.addFunction (/app/wingsuit-beta6/node_modules/twing/dist/cjs/lib/extension-set.js:112:19)
    at TwingEnvironmentNode.addFunction (/app/wingsuit-beta6/node_modules/twing/dist/cjs/lib/environment.js:665:27)
    at Object.<anonymous> (/app/wingsuit-beta6/starter-kits/tailwind/wingsuit.twing.environment.js:9:13)
    at Module._compile (node:internal/modules/cjs/loader:1376:14)
    at Module._compile (/app/wingsuit-beta6/node_modules/esbuild-register/dist/node.js:2258:26)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Object.newLoader (/app/wingsuit-beta6/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (/app/wingsuit-beta6/node_modules/esbuild-register/dist/node.js:4838:24)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)
    at Object.default_1 (/app/wingsuit-beta6/node_modules/twing-loader/dist/index.js:45:23)

This is the code inside wingsuit.twing.environment.js

const environment = require('@wingsuit-designsystem/preset-twing/twing.environment');

const TwingFunction = require('twing').TwingFunction;
const functionName = new TwingFunction('functionName', function () {
  return new Promise((resolve) => {
    resolve('demo');
  });
});
environment.addFunction(functionName);

I started debugging the issue.
So far, what I see, it's the fact that the file wingsuit.twing.environment.js is called multiple times (48 inside the starter-kit/tailwind, 76 inside our project).

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions