Comments (10)
I added this to the setup.js and it works:
Object.defineProperty(global, 'Node', {
value: {firstElementChild: 'firstElementChild'}
})
from smooth-dnd.
Mocking the library is a solution if that's ok to you.
https://jestjs.io/docs/manual-mocks#mocking-node-modules
// smooth-dnd.js or vue-smooth-dnd.js inside __mocks__ folder
module.exports = {
// some mock implementation
}
Solves the problem and as a plus we don't mess with the environment.
from smooth-dnd.
For those (like me) that #36 didn't work, and also #52, I had to spend a few hours on it just to figure it out.
Inside the smooth-dnd
lib, there's a polyfill.ts
that does, baiscally:
// Overwrites native 'firstElementChild' prototype.
// Adds Document & DocumentFragment support for IE9 & Safari.
// Returns array instead of HTMLCollection.
(function(constructor) {
if (constructor &&
constructor.prototype &&
constructor.prototype.firstElementChild == null) {
Object.defineProperty(constructor.prototype, 'firstElementChild', {
get: function() {
var node, nodes = this.childNodes, i = 0;
while (node = nodes[i++]) {
if (node.nodeType === 1) {
return node;
}
}
return null;
}
});
}
})(Node || Element);
And that polyfill just aplly up to IE9 and Safari 8, also Chrome versions up to 29. Since we're on v.289 of chrome and others, that's not even usefull. In my (updated) package, I just removed this function and every Jest test works fine.
I took the time to wrap everything up to my own way, removing the smooth-dnd
dependency and making everything to .js.
If you're still struggling with that issue, come take a look at my solution at vue-dndrop.
If that, somehow helps you, let me know. 🐈
from smooth-dnd.
@hlarcher In your project, you have a file for your jest configuration. Most of the time, it's jest.config.js. One of the properties in the exported object is setupFiles. It loads some files you want before your tests. If you don't have any setup file, create one and add it to the setupFiles array property. Just add the code above.
from smooth-dnd.
@leotabosa that was exactly what I was looking for! thank you 🚀
from smooth-dnd.
When you include directly the lib in your project, you have this error:
● Test suite failed to run
TypeError: Illegal invocation
28 | get: function() {
29 | var node,
> 30 | nodes = this.childNodes,
31 | i = 0;
32 | while ((node = nodes[i++])) {
33 | if (node.nodeType === 1) {
at Node.get [as childNodes] (node_modules/jsdom/lib/jsdom/living/generated/Node.js:332:13)
at Node.get (src/tu/smooth-dnd/src/polyfills.js:30:72)
at src/tu/smooth-dnd/src/polyfills.js:25:25
at Object.<anonymous> (src/tu/smooth-dnd/src/polyfills.js:41:3)
at Object.<anonymous> (src/tu/smooth-dnd/src/mediator.js:1:47063)
from smooth-dnd.
@alexandreDavid, thank you, it solved my problem!
from smooth-dnd.
@alexandreDavid what setup.js?
from smooth-dnd.
Hello,
Thanks for this fix, but are you sure there aren't none side effect changing this value for all tests ?
I'm really afraid of creating other bugs doing that.
(I try to add this fix directly in my beforeEach()
or beforeAll()
functions, but he warning still occur randomly.)
Thanks :)
Adeline
from smooth-dnd.
I had a similar error
TypeError: Illegal invocation
at removeEventListener (node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:157:15)
And I solved it changing the jest environment (node
instead of jsdom
) for that specific test at the top of it as the docs says https://jestjs.io/docs/en/configuration#testenvironment-string
/**
* @jest-environment node
*/
I don't know if this is could be applicable to this case.
from smooth-dnd.
Related Issues (20)
- CSS `scroll-behavior: smooth` on container kills drag to scroll
- Uncaught TypeError: Cannot read property 'addedIndex' of null HOT 2
- Question on handleInsertionSizeChange function logic
- Conflict when smooth-dnd is used by two libraries on same page HOT 2
- No more `droppedElement` ?
- er
- layoutManager: global.addEventListener('resize',fn) will cause memory leaks.
- switch to reactDropHandler or customized dropHandler in vanilla SmoothDnD
- js code fails with jquery 3.5
- using smooth-dnd with a table > tr > td and > th does not work correctly
- Change height of draggable item before drag
- Once smooth-dnd is touched, can not scroll any more page HOT 6
- zIndex 1000 - items not visible HOT 3
- Drag and Drop is take more time to set. HOT 2
- Integrate with Selecto
- how to custom GhostElement?
- Disable parent div 'mousedown' event while dragging
- illegal invocation error when using library as injected micro-ui
- Svelte smooth-dnd
- Mouse position as point to rise 'drag-enter'
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from smooth-dnd.