wingsuit-designsystem / wingsuit

Twig for Storybook
GNU General Public License v2.0
91 stars 16 forks source link

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

Open joachimjusth opened 1 month ago

joachimjusth commented 1 month ago

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).