Deleted Element Styles Are Still Saved
Question
Expected Behavior:
After deleting an element from the canvas that has received custom styles using the style manager, the deleted element's styles should no longer be saved in the styles JSON.
Actual Behavior:
The styles JSON retains entries for deleted elements on save.
Steps to Reproduce:
- Fiddle based on the starter template that logs the
stylesJSON to the console on save is available at: https://jsfiddle.net/g48sLxrt/ - Modify the default text block, changing its color to red using the style manager. The following appears in the console:
[{"selectors":[{"name":"c620","label":"c620","type":1,"active":true,"private":false,"protected":false}],"style":{"padding":"25px","color":"red"}}]
- Delete the existing, styled text block and add a new one. This output appears in the console:
[{"selectors":[{"name":"c620","label":"c620","type":1,"active":true,"private":false,"protected":false}],"style":{"padding":"25px","color":"red"}},{"selectors":[{"name":"c1044","label":"c1044","type":1,"active":true,"private":false,"protected":false}],"style":{"padding":"10px"}}]
The deleted element's styles are still present.
Environment:
- Using version 0.15.5 of GrapesJS
- Tested on: Chrome 76.0.3809.132 and Firefox 69 on Ubuntu 18.04.3
Answers (2)
Try to use the clearStyles option
const editor = grapesjs.init({
// ...
clearStyles: true,
});
That resolves the issue. Thank you!
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2921
BUG: Autosave not working on style manager when classes are disabled
Version: 0.16.18 Are you able to reproduce the bug from the demo? [x ] Yes: https://jsfiddle.net/ju1a0onx/ What is the expected behavior? A...
Issue #3002
BUG: CSS Properties are not correctly loaded if style manager panel is not active at initialization
Hi @artf! Let me describe the issue Version: 16.22 What is the expected behavior? The css property values and visibility settings should ta...
Issue #3681
Textable not working with extended text component
Version: 0.17.22 Are you able to reproduce the bug from the demo?[X] Yes[ ] No What is the expected behavior? Should be able to drop a text...
Issue #3242
When Style Manager is in another div, the message "Select an element before using Style Manager" is not showing
Version: 0.16.34 What is the expected behavior? When the editor is initialized, no element is selected, so the style manager should say "Se...
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 →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.