Wrong position of toolbar when duplicate children component
When overwrite these two methods in 'select-comp' command everything works perfectly. The problem was that "el" doesn't exist in the DOM. ` onHovered(em, component) { let result = {}; if (component) { const { view } = component; const { el } = view; const pos = this.getElementPos(el); result = { el, pos, component, vi...
Read full answer below βQuestion
Hi, you can check this example: https://codepen.io/abozhinov/pen/XWbqjEJ Steps to reproduce the problem:If components existing delete them all.Drag a new carousel block. Select the first children's container.Click on the DUPLICATE icon to create a new component.After that try to select the newest component and then select the first component again. The position of the toolbar is wrong because the browser can't get the width and height of the element. [Error] TypeError: null is not an object (evaluating 'this.canvas.getHighlighter(t).style') showHighlighter (grapes.min.js:2:263826) updateTools...
Answers (3)
When overwrite these two methods in 'select-comp' command everything works perfectly. The problem was that "el" doesn't exist in the DOM. ` onHovered(em, component) { let result = {}; if (component) { const { view } = component; const { el } = view; const pos = this.getElementPos(el); result = { el...
The same result you can get when trigger render instead of reset.
@artf if you try on the demo is the same. Just drag the carousel and click on the slide. <img width="1440" alt="Screenshot 2020-03-16 at 14 58 23" src="https://user-images.githubusercontent.com/1404839/76760669-b8b75780-6796-11ea-8e24-8946e27949f9.png">
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2824
Dragging items do not position on intital drag?
So when I drag a component/item from the bar to the center it will not go where I told it to go... IT always goes about 20% page width to o...
Issue #761
Text component problem
Hi. I wish a text component that do not create new components every time I press "Enter" key to create new paragraphs (this is a bad usabil...
Issue #4546
Component disappears when we select all the inner text and use backspace. Link component disappears even when we try to update the text.
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 104.0.5112.101 (Official Build) (arm...
Issue #2068
GrapesJs gradient plugin not working anymore
Hello GrapesJs team After updating the grapesjs version form 14.0.59 i noticed the gradient plugin stopped to work, i also checked the grad...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins βPremium plugins ship with support, regular updates, and production-ready features β save days of integration work.
Browse premium plugins βRelated tutorials
In-depth guides on the same topic.
Tutorial
GrapesJS DevTools: A Developer Panel Inside Your Editor
If you've ever debugged GrapesJS with console.log(editor.getSelected()) and a dozen throwaway event listeners β this post is for you.
Tutorial
How We Built Composeit in Record Time Using GrapesJS Shadcn
Bypass foundational builder boilerplate and focus on what truly matters.
Tutorial
Ship to Production Faster: Whatβs New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.