Problem/Motivation

Inserting the Hero Slider pattern in the Canvas editor and then publishing fails. The pattern inserts, but the Review -> Select All -> Publish widget never becomes usable, so the change cannot be published. The other seven default patterns publish normally.

hero-slider-container.js has no guard for the Canvas editor preview, unlike sticky-header.js, icon-toggle.js and offcanvas-menu.js, which all detect it. Its flattenCarouselItems() re-parents .carousel-item nodes into .carousel-inner with appendChild, and its own comment says why: "Canvas can wrap nested components with extra DOM elements". Those wrappers are how the editor maps preview DOM back to the component tree, so moving the nodes out of them leaves the publish flow with nothing to reconcile.

Steps to reproduce

  1. Open a Canvas page in the editor.
  2. Open the Patterns tab in the Library and insert "Hero Slider".
  3. Try to publish through Review -> Select All -> Publish.

It fails in CI as 09-drupal-canvas-d, scenario "a default pattern inserts through the editor, publishes and renders - Hero Slider". Five consecutive attempts failed on rightup !49, and the same lane needed retries on other recent pipelines.

Proposed resolution

Skip the setup inside the editor preview, using the same is-canvas-preview detection the other three components already use. The front end is unchanged; only the editor stops having its DOM rearranged underneath it.

Verified on a fresh install with the fix in place: the preview document carries is-canvas-preview, and insert plus Review, Select All and Publish all complete.

Remaining tasks

  • ✅ File an issue about this project
  • ❌ Addition/Change/Update/Fix to this project
  • ❌ Testing to ensure no regression
  • ❌ Reviewed by a human
  • ❌ Code review by maintainers
  • ❌ Release

User interface changes

  • None on the front end. The slider no longer initialises inside the Canvas editor preview.

API changes

  • N/A

Data model changes

  • N/A

AI-Generated: Yes

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

rajab natshah created an issue. See original summary.

  • rajab natshah committed d84a6cc1 on 1.0.x
    fix: #3625311 Do not initialise the hero slider inside the Canvas editor...
rajab natshah’s picture

Status: Active » Fixed
Issue tags: +vartheme_bs5_rightup-1.0.0-rc1

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.