Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Concurrently with the upgrade to Vue3, we will also be moving any remaining page layouts from the legacy Layout Editor to the new Page Builder

Due to these changes, sites implemented using the following custom code may see changes in visual appearance and/or behavior:

...

Affected custom code

Resolution

Custom code targeting elements with a selector starting with “ext” or “ext_ui”, for example .ext_ui_dropdownor “#extext_popover

These will be changing, and as a result will cause your code not to find the element on the page it is looking for.

In general, if you replace the “ext” and “ext_ui” with “r” (changing .ext_ui_dropdownin to .r_dropdownand #ext_popoverto #r_popover) then the custom code on the site should start working again.

Any selectors written to target particular elements on the page that might be written as follows;

.ext_ui_dropdown {background-color: green; }

Can be modified to the following;

.ext_ui_dropdown, .r_dropdown {background-color: green; }

In order for both to be targeted at once.

This means that when the migration happens the page content will transition from .ext_ui_dropdown to .r_dropdown, but because the selectors are targeting both options they should still apply.

References in the style of “el-xxx”, “[data-v-xxx]” and “rw_xxx_module”.

Unfortunately these kinds of references will need to be removed as they are being changed removed as part of the migrations that are being applied.In cases where neither of these are able to resolve your issue, please make sure that the selector you are using is still finding the element that you mean it to after the migrations are completed

This means that if there is code targeting for example div.rw_content_module , this will need updating to just div, or will need a different selector identifying that is as specific to target the same elements (which may vary from case to case).

Alerts in the style of .ext_ui_alert and type determined by .el-alert--info , .el-alert--warning, .el-alert--erroretc.

As previous advice recommendations, .ext_ui_alert can become .r_alert.

The severity tags have been updated to .alert_info, .alert_warning, .alert_erroretc.

In cases where none of the above resolutions suggestions are able to resolve your issue, please make sure that the selector you are using is still finding the element that you mean it to after the migrations are completed.

...