'Error: Could not parse CSS stylesheet' since 11.6.x

Basic info:

Node.js version: 8.9.1
jsdom version: 11.6.2

I’m getting this error after upgrading from 11.5.1 to 11.6.2 on the sweetalert2 CSS, when mounting a Vue component during a vue-test-utils mocha-webpack test run. (which uses JSDOM) Let me know if I can supply more details; not sure how to debug this.

Error: Could not parse CSS stylesheet
    at exports.createStylesheet (node_modules/jsdom/lib/jsdom/living/helpers/stylesheets.js:35:21)
    at HTMLStyleElementImpl._updateAStyleBlock (node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:68:5)
    at HTMLStyleElementImpl._childTextContentChangeSteps (node_modules/jsdom/lib/jsdom/living/nodes/HTMLStyleElement-impl.js:37:12)
    at HTMLStyleElementImpl.insertBefore (node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:225:14)
    at HTMLStyleElementImpl.insertBefore (node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:202:14)
    at HTMLStyleElementImpl.appendChild (node_modules/jsdom/lib/jsdom/living/nodes/Node-impl.js:327:17)
    at HTMLToDOM._parseWithParse5 (node_modules/jsdom/lib/jsdom/browser/htmltodom.js:60:21)
    at HTMLToDOM._doParse (node_modules/jsdom/lib/jsdom/browser/htmltodom.js:47:42)
    at HTMLToDOM.appendToNode (node_modules/jsdom/lib/jsdom/browser/htmltodom.js:37:17)
    at setInnerHTML (node_modules/jsdom/lib/jsdom/living/nodes/Element-impl.js:40:25)
    at HTMLStyleElementImpl.set innerHTML [as innerHTML] (node_modules/jsdom/lib/jsdom/living/nodes/Element-impl.js:211:5)
    at HTMLStyleElement.set [as innerHTML] (node_modules/jsdom/lib/jsdom/living/generated/Element.js:874:29)
    at node_modules/sweetalert2/dist/sweetalert2.all.js:1978:1
    at Object.<anonymous> (node_modules/sweetalert2/dist/sweetalert2.all.js:1978:1)
[snip]

Minimal reproduction case

const { JSDOM } = require("jsdom");

const options = {
    runScripts: "dangerously",
    resources: "usable"
};
const dom = new JSDOM(`
<html>
    <head>
        <link href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.18.0/sweetalert2.css" rel="stylesheet" type="text/css" media="all">
    </head>
</html>
`, options);

Issue Analytics

State:
Created 5 years ago
Reactions:6
Comments:14 (5 by maintainers)

Top GitHub Comments

19reactions

aphofstedecommented, Oct 3, 2018

@jktravis I just added this to my test setup for now 😃

const _ = require('lodash')
const originalConsoleError = console.error
console.error = function(msg) {
  if(_.startsWith(msg, '[vuex] unknown')) return
  if(_.startsWith(msg, 'Error: Could not parse CSS stylesheet')) return
  originalConsoleError(msg)
}

5reactions

joetideecommented, Jul 6, 2020

Getting same issue here too - still no resolution?

Top Results From Across the Web

console.error Error: Could not parse CSS stylesheet

"Could not parse CSS stylesheet" usually means you have some kind of error in your CSS. Without that CSS, we couldn't tell you...

[Solved]-JSDOM: Could not parse CSS stylesheet-Reactjs

Coding example for the question JSDOM: Could not parse CSS stylesheet-Reactjs.

CSS Values and Units Module Level 4 - W3C

Abstract. This CSS module describes the common values and units that CSS properties accept and the syntax used for describing them in CSS...

Safari Technology Preview Release Notes - Apple Developer

Changed animation-* declarations in @keyframes to be a parse error (254468@main) ... Fixed the title of non-CSS stylesheets to be not preferred (253632@main) ......

HTML Standard

... 10 Web workers; 11 Worklets; 12 Web storage; 13 The HTML syntax; 14 The XML syntax; 15 Rendering; 16 Obsolete features; 17...