colxi / css-global-variables

Easy manipulation of CSS Global variables using Javascript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Cannot be used with Jest

LifeIsStrange opened this issue · comments

● Test suite failed to run

    TypeError: Cannot read property 'getAttribute' of undefined

       8 |     return name.replace(/[A-Z]/g, m => "-" + m.toLowerCase());
       9 |   };
    > 10 |   public mainBlackTextColor = new CSSGlobalVariables({ normalize: this.camelToHyphens }).mainBlackText;
         |                               ^
      11 |   public mainWhiteTextColor = new CSSGlobalVariables({ normalize: this.camelToHyphens }).mainWhiteText;
      12 | 
      13 |   public getRandId(): string {

we have added css-global-variables to transformIgnorePatterns like we do for other libraries but it fail :/

The issue seems to be that CSSGlobalVariables use native dom and therefore require a browser context, but Jest seems to execute it before the browser context is loaded. If that hypothesis is true, then to solve this issue, this library would need to expose an optional flag that await that e.g the root dom node has loaded before executing, or at least that do nothing if the DOM is not loaded. A bit like in https://github.com/Andarist/react-textarea-autosize/pull/127/files