Video component error
Hi @olgertpysqyli you should follow this and rely on JSON data for editing https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates
Read full answer below ↓Question
I have a problem with video component.
I select provider and add the source of the video and then save the html, but when i load the html again to the editor video component source gets replaced with < svg xmlns="http://www.w3.org/2000/svg" width="100" viewBox="0 0 24 24" style="fill: rgba(0,0,0,0.15); transform: scale(0.75)"><path d="M8.5 13.5l2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2z"></path></ svg>.
Is there any possibility to fix this issue I'm saving html from editor.getHtml() and giving it again with editor.setComponents();
Answers (1)
Hi @olgertpysqyli you should follow this and rely on JSON data for editing https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3615
text in text component cannot update , cannot get final result from toHTML
it is text component, if select body, the text will correct save/apply/store in component toHTML method, if just updating text, but not lea...
Issue #3604
editor.on('component:update:content', model => { }}) not work in some cause
if the user remove all text from a element and click some where else . then again try to select empty element he is not able to select it a...
Issue #3075
BUG: Unhandled Rejection (TypeError): i.classList is undefined
Hi. I updated GrapesJS to its current version 0.16.22 and I get an error on the callback function: editor.on("component:add", (model) => {...
Issue #2792
Video component error on provider update
Hi, when provider change I get the "this.model is undefined" error in updateProvider function. This screenshot is form https://grapesjs.com...
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
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
Tutorial
Embed GrapesJS in Your SaaS: A Weekend Guide
Embed GrapesJS in your SaaS and ship a white-label page builder over a weekend. Honest tradeoffs, real code, and the plugins that close the UX gap.
Tutorial
🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS
Building professional, responsive, email-safe templates has always been one of the biggest challenges for developers and marketers.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.