Issue #2493Opened January 7, 2020by andrewryan19060 reactions

Invalid array length when dragging component onto canvas

Question

Not sure why,

But all of a sudden, when I start dragging components onto a canvas, I get this:

image

This seems to happen when I edit a template, save it, and reload it. It also seems to happen when I try to drag a new component to the LAST element of the page; if I try to drag and element inside of a DIV container inside the template, it's fine. But if I try to drag it at the beginning of the template, I get the duplicate items I referenced in #2494 . I have a feeling this is related; somewhere there's a null array that's not supposed to be null.

WIthout trying to erect an entire sandbox to repro outside of my application, any quick thoughts on what might be causing this?

Any ideas on things I could do to track down the problem?

Answers (2)

andrewryan1906January 7, 20200 reactions

Here's another clue... once the canvas "breaks" (which I can reliable make happen by refreshing the page and forcing a load... this behavior doesn't happen on new templates, only when the template is loaded from my custom storage, but I verified the JSON hasn't been corrupted), if I take a component and drag it over the canvas, it creates "ghost" copies of the component, even though I haven't dropped it. Every time I hover to the top of the canvas, a new ghost component is created - again, even though I haven't dropped. Image below:

image

Any thoughts welcome, thanks!

andrewryan1906January 7, 20200 reactions

OK,

I managed to stick grapes.js into my Angular project and reference it instead of the minified version, so I could get more insight into what is going on. The problem seems to be in Sorter.js. The findPosition method is tasked with figuring out which element the cursor is hovering over. For some reason, this line of code:

result.indexEl = dim[6]; // If it's not in flow (like 'float' element)

Is coming back NaN. This is tricking all the way through the code and causing an invalid array length.

When I look at the dims, which is a two dimensional array with all of - I guess? - the dimensions of the components on the canvas, I see: image

So... this is interesting. What I'm guessing is happening is that whatever's causing #2494, is creating a ghost component that has no location... and thus is causing THIS error.

I'll leave this ticket open but add my findings to #2494.

Related Questions and Answers

Continue research with similar issue discussions.

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.