Issue #1756Opened January 28, 2019by muzniousx1 reactions

Drag and Drop not working in resized editor window in Google Chrome

Question

Hi, I developed some components and all works fine in Firefox, Opera browser.

In Google chrome also working fine in fullscreen editor mode only. But, when resizing the editor screen size(custom width & height), drag and drop is not working for all components. The green bar to point the target drop location is also not showing.

In Some times, It only allows only one component to drag and drop and then it blocks all other components. And No errors are shown in console window.

I tried a lot to fix this issue. Cleaned the cache, But, still i couldn't find a solution. I think when resizing the editor window, some listeners are not registering properly in resized editor window in Google Chrome. Can you give me good a solution for this issue? Thanks.

Answers (3)

muzniousx• April 5, 20191 reactions

Hi, Thanks for your reply. editor.refresh() also didn't work. But, finally the issue was fixed when updating the google chrome and grapesjs-preset-newsletter.

artf• February 5, 20190 reactions

Can you explain how do you resize the editor?

muzniousx• February 6, 20190 reactions

Code SnippetTEXT

This is the function i use for resize the window.

    function resizeEditor() {
        if ($('.detailview-header').length > 0) {
            $('#MyTemplateEditor').height(($(window).height() - 150 - $('.detailview-header').outerHeight(true) - 70) + 'px');
        } else {
            $('#MyTemplateEditor').height(($(window).height() - 150) + 'px');
        }
        $('#MySettingsContentContainer').height(($('#MyTemplateEditor').height() - 65) + 'px');
    }


    //This is how i initially resize the editor window

    resizeEditor();
    $(window).on('resize', resizeEditor);

(the above code works fine in Firefox and Opera browser)

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Drag and Drop not working in resized editor window in Google Chrome

Question

Answers (3)

Related Questions and Answers

Editor.setdevice() not working properly on some browsers.

IE 11 issue

[BUG] Drag and drop blocks are not working in IE Browser

[QUESTION] ID changes when importing html or passing html in components prop in config.

Paid Plugins That Match This Issue

Browse Plugin Categories