sveltejs / svelte-cli

Command line interface for Svelte
MIT License
104 stars 18 forks source link

"Uncaught TypeError: node.removeEventListener is not a function" when use Svelte with jQuery on the same page #14

Closed constgen closed 7 years ago

constgen commented 7 years ago
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="../dist/main.js"></script>

When both Svelte and jQuery are included on the page there is an exception "Uncaught TypeError: node.removeEventListener is not a function"

The issue is caused by this function that is generated in the global namespace and rewrites a method of a window object

function removeEventListener ( node, event, handler ) {
    node.removeEventListener ( event, handler, false );
}

Exception is thrown when jQuery calls this function

/**
 * The ready event handler and self cleanup method
 */
function completed() {
    document.removeEventListener( "DOMContentLoaded", completed, false );
    window.removeEventListener( "load", completed, false );
    jQuery.ready();
}

In this case the compiled function is called but not native method and the first argument is "load" instead of DOM node. The advised solution is to wrap all code generated by the compiler to a self invoked function and avoid rewriting of window.removeEventListener() method.

constgen commented 7 years ago

This issue might be related to https://github.com/rollup/rollup-plugin-svelte , so I opened it there and closed here