jest-preset-angular: I could not use MaterialModule

 console.warn node_modules/@angular/material/bundles/material.umd.js:146
    Current document does not have a doctype. This may cause some Angular Material components not to behave as expected.

  console.warn node_modules/@angular/material/bundles/material.umd.js:159
    Could not find Angular Material core theme. Most Material components may not work as expected. For more info refer to the theming guide: https://material.angular.io/guide/theming


ReferenceError: CSS is not defined

What should i do?

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 1
Comments: 20 (9 by maintainers)

Most upvoted comments

adding

Object.defineProperty(window, 'CSS', {value: mock()});

to my jestGlobalMocks.ts seems to have cleared up the CSS is not defined issue for me.

ollwenjones on Jun 27, 2017

I add some mock

Object.defineProperty(document, 'doctype', {
  value: '<!DOCTYPE html>'
});
Object.defineProperty(window, 'getComputedStyle', {
  value: () => {
    return {
      display: 'none',
      appearance: ['-webkit-appearance']
    };
  }
});

and warning messages

console.warn node_modules/@angular/material/bundles/material.umd.js:146
    Current document does not have a doctype. This may cause some Angular Material components not to behave as expected.

  console.warn node_modules/@angular/material/bundles/material.umd.js:159
    Could not find Angular Material core theme. Most Material components may not work as expected. For more info refer to the theming guide: https://material.angular.io/guide/theming

are gone

zack9433 on Jul 28, 2017

You’re probably hitting this: https://github.com/facebook/jest/issues/3299 I’ll be implementing new testEnvironment for this preset, so I can keep that in mind and add support for doctype. If you don’t have time, you can create your own testEnvironment (copy-paste existing one and adjust it as I commented in mentioned issue)

Use it in your jest config like:

{
  "testEnvironment": "path/to/your/custom_test_env.js"
}

thymikee on Jun 20, 2017