soflyy / breakdance-bugs

Bug reports from Breakdance users.
42 stars 6 forks source link

Element Studio - %%ID%% wrong in HTML Attributes From Element Studio in Frontend #918

Open ghost opened 1 year ago

ghost commented 1 year ago

When adding %%ID%% in a HTML attribute the ID is wrong (only in Frontend it seems wrong, in Backend the ID seems OK).

For example when you add a attribute like data-id and set %%ID%% as value, the ID isn't he same as %%ID%% in the twig css file. Also %%SELECTOR%% isn't the same.

So I think this is a Bug.

ghost commented 1 year ago

Ok, I found out something. I added the attribute data-test and as a value %%SELECTOR%%. Apparently the selector is taken from the section and not from the element. So this is a bug!

louisreingold commented 1 year ago

Not every tag is supported in every location. Use them like we do in the built-in elements and they'll all work as intended.

ghost commented 1 year ago

Sure, but in the Breakdance Editor %%ID%% is working, but not on frontend.

So here is a example: I've built a custom tooltip element. I use tippy.js like BD uses. This tooltip has some design options (like background color, padding, arrow... and so on) ). The difference is - my custom Tooltip element has more options. Also my tooltip element has one JS file. This JS file is executed by a factory class that I've written for all elements, so I don't use any inline script (which is very cool, cause every JS Script uses the same structure, and I don't need to think of how I need to manage everything inside the Builder and frontend ). Now, when I hover the tooltip element, tippy generates the dom (at runtime). In my script I create a instance of tippy.js and use the attribute "theme". The theme name should be like 'tippy-theme- THE_ID_OF_THAT_ELEMENT'. So it is unique. I use a data attribute in that element to pass the %%ID%% . The JS file now indicates the ID of that element. The tooltip element styling is in the twig / css file like '.tippy-theme- %%ID%% {...}'.

So I have a no inline script, everything should be fine.... but the ID is wrong! I think there are many purposes, where passing the id of elements is important. So I think that is a bug (backend yes, frontend no).