Page.getMainComponent().view gives undefined when page is selected
Hi @iabhiyaan, when page:select triggers, iframes inside the canvas are not yet loaded, so you just need to wait once they are loaded before accessing its DOM.
Read full answer below βQuestion
Hello @artf, I want to get the HTML Element of selected page. But it returns undefined when using following code:
editor.on('page:select', page => {
page.getMainComponent().view.el.querySelector('section'); // There is section tag inside that page...
});
Answers (3)
Hi @iabhiyaan, when page:select triggers, iframes inside the canvas are not yet loaded, so you just need to wait once they are loaded before accessing its DOM.
Thankyou @artf.
Thanks for reporting this, @iabhiyaan. Thanks for sharing your report about page.getMainComponent().view gives undefined when page is selected. To help the team investigate and prioritize this: Please provide: A minimal reproducible example (CodeSandbox/JSFiddle) Your GrapesJS version number Browse...
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3219
Add Type for block and css with class name
Hi @artf I am stuck on one thing I want to add one block in which I want to add style with the class name also Here is my code -: This give...
Issue #3448
Applying custom class to component doesn't seem to be working
I'm adding a class on a component when certain conditions aren't met, in this case when there's no href set. I viewed the source and see th...
Issue #3347
How can I get Uncompressed JS code for me to edit?
Hi, thank you for reviewing my problem. I want to use my own JSEditor to edit htmlγcss and js. 1γFirst, I use getHtml, getCss, getJs to dis...
Issue #3512
Child elements not draggable ,droppable highlightable. also the CSS of all child elements not pushed in style section while develop a banner component in as plugin
Hello @artf , I am trying to develop a simple banner plugin which will be include a heading , subheading and link. and every element can be...
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
Lighthouse for GrapesJS: Audit Accessibility and SEO Without Leaving the Editor
Live WCAG 2.1/2.2 accessibility auditor + SEO manager for GrapesJS. Every finding is bound to the exact component β click to select, then one-click fix.
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.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.