kutlugsahin / vue-smooth-dnd

Vue wrapper components for smooth-dnd
MIT License
1.73k stars 250 forks source link

Conflict with vue-awesome-swiper: Cannot read property 'querySelectorAll' of null #52

Open TitanFighter opened 6 years ago

TitanFighter commented 6 years ago

Actually, based on the trace, smooth-dnd conflicts with swiper, but because I do not use smooth-dnd directly, I opened issue here.

Demo -> Just click a slide and you will see the error and trace.

The first issue in the trace is in node_modules/smooth-dnd/dist/index.js:1:15831

If we comment

Vue.component("dnd-container", Container); Vue.component("dnd-draggable", Draggable);

vue-awesome-swiper starts working.

zerosym commented 5 years ago

It's an issue with the polyfill here: https://github.com/kutlugsahin/smooth-dnd/blob/master/src/polyfills.js#L1

(this.document || this.ownerDocument) winds up as null during certain swiper routines

If anyone needs a temporary fix just copy/paste the poly and modify it to check for null. Include somewhere in your code before smooth-dnd gets imported.

TitanFighter commented 5 years ago

@zerosym thanks you! @kutlugsahin Could you please fix it?

WebKieth commented 5 years ago

@TitanFighter this issue duplicated from vue swiper repo https://github.com/surmon-china/vue-awesome-swiper/issues/430 Second hotfix solution - downgrade vue swiper on 2.6.7 (using swiper 3.4.2) and updage configs by 3.4 docs https://github.com/nolimits4web/Swiper/blob/Swiper3/API.md