question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ReferenceError: HTMLElement is not defined

See original GitHub issue

Hello, I’m using Webstorm to run Mocha tests (on react components) using Chai together with Enzyme, Sinon and Sinon-chai.

I’m doing something like this: expect(ChildSpy).to.have.been.calledWithMatch({a:'a', b: 'b'}); that basically is the same as saying: sinon.assert.calledWith(ChildSpy, sinon.match({a:'a', b: 'b'}));.

However I use it I receive and exception from this packages, exactly from this line:

ReferenceError: HTMLElement is not defined
    at typeDetect (node_modules/type-detect/index.js:159:24)
    at typeOf (node_modules/sinon/lib/sinon/util/core/typeOf.js:6:12)
    at Object.match (node_modules/sinon/lib/sinon/match.js:103:16)
    at Context.<anonymous> (test/main.js:106:45)

Apparently the HTMLElement used in this function is not defined. Does that depend on the node version or maybe was this package conceived to run in the browser and not in node?

if (obj instanceof HTMLElement && obj.tagName === 'BLOCKQUOTE') {
    return 'HTMLQuoteElement';
}

Maybe there is a check somewhere to understand if we are in a browser or not but I could have make things difficult to check because before starting my tests I do this:

// Setup for enzyme: http://airbnb.io/enzyme/docs/guides/jsdom.html
const doc = jsdom.jsdom('<!doctype html><html><body></body></html>', {
  url: 'http://localhost'
});
const win = doc.defaultView;

// Setup for react test-utils 'renderIntoDocument':
// it requires window, window.document and window.document.createElement
// globally available before you can import React
global.document = doc;
global.window = win;
global.navigator = win.navigator;

So type-detect believes is in a browser when in fact it’s not? 🤔

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:7
  • Comments:8

github_iconTop GitHub Comments

34reactions
titsecommented, Aug 25, 2017

This worked for me when i declared JSDOM in a separate file and use require with mocha

var jsdom = require('jsdom');
// Create a fake DOM for testing with $.ajax
global.window = new jsdom.JSDOM().window;
global.document = window.document;
global.HTMLElement = window.HTMLElement;
6reactions
LeonardoGentilecommented, Apr 14, 2017

Temp fix until #91 will be solved:

// [...] continues from above code
global.HTMLElement = win.HTMLElement;
Read more comments on GitHub >

github_iconTop Results From Across the Web

ReferenceError: HTMLElement is not defined in TypeScript
Some time ago I had a problem in having Typescript recognize some basic DOM classes, which has been solved adding "lib": [ "es2016",...
Read more >
HTMLElement is not defined for Custom Element? | Velo by Wix
I'm attempting to add a custom element to my site, however anytime I add an element, I get the following console error: ReferenceError: ......
Read more >
HTMLElement is not defined in TypeScript-angular.js
Coding example for the question ReferenceError: HTMLElement is not defined in TypeScript-angular.js.
Read more >
John Otander on Twitter: "@hansalbern @AskGatsbyJS We ...
but it has the same problem I already encountered: Trying to run a production build results in : WebpackError: ReferenceError: HTMLElement is not...
Read more >
How to use Web Components with Next.js and TypeScript
Property 'atom-spinner' does not exist on type 'JSX. ... ReferenceError: HTMLElement is not defined ... I have no experience with that.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found