Ad
Append The HTML Tag To The Document. HierarchyRequestError: The Operation Would Yield An Incorrect Node Tree
I was testing my React/TypeScript project with Jest + Enzyme.
When I created an HTML tag and appended it to the document, I got an error. This was the unit test code that produced the error:
const htmlTag: HTMLElement = document.createElement('html');
htmlTag.setAttribute('myAttribute', 'myValue');
document.appendChild(htmlTag); // HierarchyRequestError: The operation would yield an incorrect node tree
So Jest didn't like something about adding an HTML tag to the document. A similar post implies that what I am trying to do is not possible, but since I need to test what my code does to a particular HTML attribute, how else would I test that?
Is there a better way to add the HTML tag to the document so that I can test its attributes later?
Ad
Answer
Is there a better way to add the HTML tag to the document so that I can test its attributes later?
The HTML tag didn't need to be added. I just "got" it!
const htmlTag = document.getElementsByTagName('html')[0]; // The html tag is still attached to the DOM
Now I can set or test its attributes per this code.
Ad
source: stackoverflow.com
Related Questions
- → Import statement and Babel
- → should I choose reactjs+f7 or f7+vue.js?
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → .tsx webpack compile fails: Unexpected token <
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → React Native with visual studio 2015 IDE
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
- → How do I determine if a new ReactJS session and/or Browser session has started?
- → Alt @decorators in React-Native
- → How to dynamically add class to parent div of focused input field?
Ad