GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.37k stars 4.05k forks source link

IE browser issue #768

Closed frank-tenzing closed 6 years ago

frank-tenzing commented 6 years ago

Hi @artf ,

Created this issue due to https://github.com/artf/grapesjs/issues/214 has been closed ...

I cloned the latest repo and run it on IE 11, an error: SCRIPT438: Object doesn't support property or method 'replace' - grapes.min.js (15612,7) demonstrates on the console, when I clicked it, it jumped to the line in 'removeClass' function: function removeClass(v, c) { if (v.classList) { v.classList.remove(c); } else { v.className = v.className.replace(c, ""); } } The 'v.className' was 'SVGAnimatedString' type when I debug it, but there is no replace function for that type. What is supposed to do here and When will this function be called ? Thank you very much!

artf commented 6 years ago

@frank-tenzing not sure if it's IE's only error, are you facing this issue with some kind of template (which probably contains some SVG element)?

frank-tenzing commented 6 years ago

Hi @artf , what I have done after cloned the latest repo are 1). Replaced the start script with "start": "webpack-dev-server --open --progress --colors & npm run build:css -- -w",; 2). Commented the editor.BlockManager.add('testBlock', { label: 'Block', attributes: { class:'gjs-fonts gjs-f-b1' }, content: <div style="padding-top:50px; padding-bottom:50px; text-align:center">Test block</div> }) in index.html;

Then when I run it on IE 11, SCRIPT438: Object doesn't support property or method 'replace', grapes.min.js (15612,7) is showing on the console. function removeClass(v, c) { if (v.classList) { v.classList.remove(c); } else { v.className = v.className.replace(c, ""); } }

And when I debugged it, v.className parsed as SVGAnimatedString.

artf commented 6 years ago

@frank-tenzing thanks, but what about other browsers?

frank-tenzing commented 6 years ago

@artf It is working fine with Chrome, but IE is the primary browser our client prefer to use.

artf commented 6 years ago

That snippet is from cash library and I think it's related to https://github.com/kenwheeler/cash/issues/131 BTW we could patch it internally in https://github.com/artf/grapesjs/blob/dev/src/utils/extender.js#L104 probably by doing this https://stackoverflow.com/questions/12588913/svganimatedstring-missing-method-indexof#answer-12592009

Moikapy commented 6 years ago

Any progress on this fix? It seems we are having the same issue, and most of our users use IE11+.

Moikapy commented 6 years ago

after using the boilerplate to start my plugin I was able to get GJS to work in all browsers.

ghost commented 6 years ago

Still failing in IE11 with the latest update (0.14.6) Not able to add (drag and drop) elements to canvas. Works fine in Chrome/Firefox.

Getting following errors:

image

ghost commented 6 years ago

Thank you @artf After latest changes, I'm able to add elements to canvas, works very well. But now, I'm facing another issue. As soon as I select element in canvas, my IE 11 hangs with following error:

screenshot_20180401_120022

this.getClearEl() returns NULL.

lock[bot] commented 5 years ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.