Converting Reusable or Component to blocks should randomize all blocks classes/ids to prevent CSS conflicts

Cwicly Plugin version: 1.3.1

Hi,

When converting a reusable or a component to blocks, all blocks (container and all descendants) classes stay the same, i.e. they are not regenerated.

This is an issue because when using the component/reusable and the blocks-only version on the same post, there are conflicts between CSS rules: the winning rules are the ones from the latest element in the page.

WORKAROUND: Convert to blocks, duplicate with Cwicly, remove converted blocks and keep only duplicated blocks.

image

Definitely a valid issue.

This is one reason why we avoid using the dynamically generated class names and use semantic naming for them instead and prefer the use of reusable global classes as well, where appropriate.

Hi,

Thanks so much for the report!
Cwicly does not randomize block IDs/classes if there are no other blocks with the same IDs/classes.

I have been able to reproduce the issue when detaching patterns or components that are already on the page.

I have added it to the bug tracker.

Best regards,
Johnny

1 Like