Skip to content

Fixed Upload New Image button not working in Pagebuilder when trying to change image #39576

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
wants to merge 4 commits into from
Closed

Fixed Upload New Image button not working in Pagebuilder when trying to change image #39576

wants to merge 4 commits into from

Conversation

manan-patel1
Copy link

Preconditions (*)

  1. Magento version : 2.4 - develop
  2. Magento version : 2.4.7-p3

Description (*)

In Adminside, The image is uploaded for the first time in pagebuilder. When we try to change the uploaded image then the 'Upload New Image' button does not work.

Related Issue

Fixes #39063

Manual testing scenarios (*)

  1. Edit a product
  2. Scroll to and expand content section
  3. Click Edit with Page Builder
  4. Insert a row
  5. Add Image media element to the row
  6. Hover over "Image" element - "Upload Image" / "Select from Gallery" popup should appear.
  7. Click on "Upload Image"
  8. Again hover on the uploaded image - "Upload New Image" / "Select from Gallery" popup should
    appear.
  9. Click on "Upload New Image" then you see that the button is not clickable.
issue-reproduce.mp4

Expected result

You should be able to upload new images after clicking "Upload New Image".

Actual result

No response when clicking "Upload New Image".

Additional Information

File: magento/module-ui/view/base/web/js/form/element/file-uploader.js

In Magento 2.4.7, the jQuery file uploader (jquery.fileuploader.js) has been replaced with Uppy (uppy.min.js), leading to changes in the JS logic of file-uploader.js. The replaceInputTypeFile function binds the click event only to the "Upload Image" button inside .pagebuilder-image-empty-preview (used when no image is uploaded). However, it misses the button in the toolbar that appears on hover for content types like Banner, Slider, and Image (when an image is already uploaded).

Contribution checklist (*)

  • Pull request has a meaningful description of its purpose
  • All commits are accompanied by meaningful commit messages
  • All new or changed code is covered with unit/integration tests (if applicable)
  • README.md files for modified modules are updated and included in the pull request if any README.md predefined sections require an update
  • All automated tests passed successfully (all builds are green)

@m2-assistant M2 Assistant
Copy link

m2-assistant bot commented Jan 28, 2025

Hi @manan-patel1. Thank you for your contribution!
Here are some useful tips on how you can test your changes using Magento test environment.
❗ Automated tests can be triggered manually with an appropriate comment:

  • @magento run all tests - run or re-run all required tests against the PR changes
  • @magento run <test-build(s)> - run or re-run specific test build(s)
    For example: @magento run Unit Tests

<test-build(s)> is a comma-separated list of build names.

Allowed build names are:
  1. Database Compare
  2. Functional Tests CE
  3. Functional Tests EE
  4. Functional Tests B2B
  5. Integration Tests
  6. Magento Health Index
  7. Sample Data Tests CE
  8. Sample Data Tests EE
  9. Sample Data Tests B2B
  10. Static Tests
  11. Unit Tests
  12. WebAPI Tests
  13. Semantic Version Checker

You can find more information about the builds here
ℹ️ Run only required test builds during development. Run all test builds before sending your pull request for review.

For more details, review the Code Contributions documentation.
Join Magento Community Engineering Slack and ask your questions in #github channel.

@manan-patel1
Copy link
Author

@magento run all tests

@manan-patel1 manan-patel1 changed the title Fixed new image uploading issue in pagebuilder Fixed Upload New Image button not working in Pagebuilder when trying to change image Jan 30, 2025
@engcom-Hotel engcom-Hotel added the Priority: P2 A defect with this priority could have functionality issues which are not to expectations. label Feb 4, 2025
@Priyakshic Priyakshic added the Project: Community Picked PRs upvoted by the community label Feb 12, 2025
@engcom-Hotel engcom-Hotel self-requested a review February 13, 2025 06:27
@engcom-Hotel
Copy link
Contributor

@magento run all tests

engcom-Hotel
engcom-Hotel requested changes Feb 13, 2025
View reviewed changes
Copy link
Contributor

@engcom-Hotel engcom-Hotel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello @manan-patel1,

Thanks for the contribution!

The changes seems fine to us and the failed tests seems flaky except static failure for which we need to create an approval JIRA ticket.

However, please add an automated test to verify that the bug is fixed in accordance with the Definition of Done (DoD).

Thanks

@hostep
Copy link
Contributor

hostep commented Feb 13, 2025

I don't see why an approval ticket is needed to fix the static tests, these seem like issues that can be fixed easily, no?

- line 185, col 1, Error - This line has a length of 159. Maximum allowed is 120. (max-len)
- line 187, col 16, Error - Trailing spaces not allowed. (no-trailing-spaces)

@manan-patel1
Copy link
Author

@magento run all tests

@engcom-Hotel
Copy link
Contributor

Thanks @hostep, my bad, we can resolve the static test failures.

@manan-patel1 As I can see, you have already started working on it, we still can see some failures. Please fix those and add an automated test for the fix.

Thanks

@manan-patel1
Copy link
Author

@magento run all tests

@manan-patel1
Copy link
Author

Hi @engcom-Hotel ,
I have updated my code and static tests are passing. Although there are some tests that still fail, but they may not be relevant to my solution.

@manan-patel1
Copy link
Author

@magento run all tests

@engcom-Hotel
Copy link
Contributor

Hello @manan-patel1,
Thanks for the update!

As per the review comment, you need to add an automated test as well for the fix include in this PR. Please do the needful for the same.

Thanks

@Den4ik Den4ik self-requested a review March 2, 2025 20:02
Den4ik
Den4ik requested changes Mar 2, 2025
View reviewed changes
Copy link
Contributor

@Den4ik Den4ik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @manan-patel1
Thanks for contribution.
However file-uploader.js is a common component used in multiple modules. We have separate repository for the Page Builder and I believe this PR should be implemented to Page Builder module.

@engcom-Hotel
Copy link
Contributor

Hello @manan-patel1,

Please look into this #39576 (review) made by @Den4ik. I also agree with the point raised. Please create a PR on PageBuilder repo here.

Meanwhile we are moving this PR on hold bucket.

Thanks

@engcom-Hotel engcom-Hotel moved this from Changes Requested to On Hold in Community Dashboard Mar 18, 2025
@engcom-Hotel
Copy link
Contributor

Hello @manan-patel1,

We have noticed that this PR has not been updated for a while. Therefore, we are closing it for now.

Thank you for your valuable contribution!

@ganeddact ganeddact mentioned this pull request Apr 22, 2025
Closed
@ganeddact
Copy link

Still an issue on 2.4.7-p5. I've opened an issue on the PageBuilder GitHub, referencing the original issue here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@Den4ik Den4ik Den4ik requested changes

@engcom-Hotel engcom-Hotel engcom-Hotel requested changes

Assignees
No one assigned
Labels
Priority: P2 A defect with this priority could have functionality issues which are not to expectations. Progress: on hold Project: Community Picked PRs upvoted by the community
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[ISSUE] PageBuilder Banner element - upload new image button is not responding
6 participants
@manan-patel1 @engcom-Hotel @hostep @ganeddact @Den4ik @Priyakshic