Uploaded image for project: 'eZ Platform Enterprise Edition'
  1. eZ Platform Enterprise Edition
  2. EZEE-2580

Block definition modal UI not working with multiple embed attributes

    XMLWordPrintable

Details

    Description

      Hello,

      When trying to create a page builder's custom block with two (or more) embed attributes I'm having a UI bug in the block definition's modal.

      The bug happens when I fill the second embed attributes : the preview of the
      SECOND embed with the trash button will overlap the preview of the first embed.

      Step to reproduce:
      1. Create custom block with two embed attributes

      ezplatform_page_fieldtype:
          blocks:
              promo:
                  name: Promo
                  category: default
                  thumbnail: '/assets/images/page_builder/blocks/hero.svg#hero'
                  configuration_template: '@EzPlatformPageBuilder/page_builder/block/config/embed.html.twig'
                  views:
                      standard:
                          template: '@ezdesign/blocks/promo.html.twig'
                  attributes:
                      contentId:
                          name: Image
                          type: embed
                          validators:
                              not_blank:
                                  message: You must provide value
                              regexp:
                                  options:
                                      pattern: '/[0-9]+/'
                                  message: Choose a Content item
                      contentId2:
                          name: Image2
                          type: embed
                          validators:
                              not_blank:
                                  message: You must provide value
                              regexp:
                                  options:
                                      pattern: '/[0-9]+/'
                                  message: Choose a Content item
      

      2. Create a new page and insert the new custom block
      3. Open block configuration modal (step1.png)
      4. Fill first embed with any content (an image here) (step2.png)
      5. Fill the second embed with any other content ( another image here). Bug should happen ! (step3.png)
      6. Validate block configuration, we can see the two embed value have been saved correctly (see dump). (step4.png)
      7. Open block configuration modal again, The display is good (step5.png) but another bug : Only first trash button can be clicked.

      PS: I know that using 'locationlist' attribute instead of 'embed' could solve this use case but I have others blocks more complex where I need multiple embed attributes.

      Attachments

        1. step1.png
          step1.png
          229 kB
        2. step2.png
          step2.png
          331 kB
        3. step3.png
          step3.png
          293 kB
        4. step4.png
          step4.png
          10 kB
        5. step5.png
          step5.png
          316 kB

        Activity

          People

            Unassigned Unassigned
            stephane.diot-obsolete@ez.no Stéphane Diot (Inactive)
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved: