LPS-125413 Use new ImageSelector component in image-selector tag and remove old one #1494

carloslancha · 2021-02-11T13:00:20Z

Following up on #1484

https://issues.liferay.com/browse/LPS-125413

In this pr we're removing the old image-selector AUI component in favor of the new React one.

We're adding some missing markup in the React component and removing no needed one for SSR in the JSP

Made also some refactor and renaming in the React Components.

Deprecate draggableImage in favor of new imageCropDirection attribute in ImageSelector tag to improve naming.

Test Plan 1:

Go to Content & Data / Blogs
Create a new Blog
Select an image bigger than the container
Click and move vertically the picture to crop it in the desired position
Publish
Edit the blog
Check that the image has been cropped correctly

Test Plan 2:

Go to Content & Data / Blogs
Edit an existing Blog with an image
Check that you can't move the image since it's already cropped
Remove the image and repeat Test plan 1 from point 3.

…ttribute in favor of imageCropDirection. Add isDraggable logic to Tag.

…and using new ImageSelector react component

…name some methods to improve naming consistency. Add missing markup. Update props to fit new API from tag.

liferay-continuous-integration · 2021-02-11T13:00:26Z

To conserve resources, the PR Tester does not automatically run for every pull.

If your code changes were already tested in another pull, reference that pull in this pull so the test results can be analyzed.

If your pull was never tested, comment "ci:test" to run the PR Tester for this pull.

carloslancha · 2021-02-11T13:11:31Z

ci:test:sf

liferay-continuous-integration · 2021-02-11T13:15:47Z

✔️ ci:test:sf - 1 out of 1 jobs passed in 4 minutes

Click here for more details.

Base Branch:

Branch Name: master
Branch GIT ID: 9272e31bc0297f9ad114de2c3a67f68aec8ea3cd

Sender Branch:

Branch Name: LPS-125413-migrate-image-selector.2
Branch GIT ID: c3ff4808aa42117f064ee59e69d2f7eedcabf145

1 out of 1jobs PASSED

1 Successful Jobs:

test-portal-source-format

For more details click here.

carloslancha · 2021-02-11T13:24:26Z

ci:test:relevant

liferay-continuous-integration · 2021-02-11T13:28:57Z

Jenkins Build:test-portal-source-format#2631
Jenkins Report:jenkins-report.html
Jenkins Suite: sf
Pull Request:liferay-lima#1494
Spira Release:/Liferay DXP 7.4/Pull Request/ci:test:sf
Spira Release Build:master - carloslancha > liferay-lima - PR#1494 - 2021-02-11[05:11:45]
Spira Jenkins Build:publish-spira-report#13702

boton · 2021-02-11T13:58:48Z

Just started reviewing :)

Sent from GH.

boton · 2021-02-11T16:10:39Z

I think the failure is not from this PR but it had not been detected until now, when a draft is autosaved we find the input coverImageFileEntryCropRegion and on blogs.js we are trying to retrieve the value with getElementById https://github.com/liferay/liferay-portal/blob/5860529bcad88ac3c9b2f76f7e5cd7c877e5cc23/modules/apps/blogs/blogs-web/src/main/resources/META-INF/resources/blogs/js/blogs.js#L363-L365 so it would be fine to add that missing id with the same value of the name.
https://github.com/liferay-lima/liferay-portal/blob/c3ff4808aa42117f064ee59e69d2f7eedcabf145/modules/apps/item-selector/item-selector-taglib/src/main/resources/META-INF/resources/image_selector/js/ImageSelector.js#L316

It is a little trickier to see because that part of the code is only passed when drafts are saved in the background, you only have to leave it open for a few seconds with some type of content to see the failure.

liferay-continuous-integration · 2021-02-11T16:25:27Z

✔️ ci:test:stable - 9 out of 9 jobs passed

❌ ci:test:relevant - 18 out of 23 jobs passed in 2 hours 28 minutes

Click here for more details.

Base Branch:

Branch Name: master
Branch GIT ID: 9272e31bc0297f9ad114de2c3a67f68aec8ea3cd

Upstream Comparison:

Branch GIT ID: 9272e31bc0297f9ad114de2c3a67f68aec8ea3cd
Jenkins Build URL: Acceptance Upstream DXP (master) #1542

ci:test:stable - 9 out of 9 jobs PASSED

9 Successful Jobs:

ci:test:relevant - 18 out of 23 jobs PASSED

5 Failed Jobs:

18 Successful Jobs:

For more details click here.

Failures unique to this pull:

test-portal-acceptance-pullrequest-batch(master)/functional-tomcat90-mysql57-jdk8/0
Job Results:
3 Tests Passed.
2 Tests Failed.
1. AXIS_VARIABLE=0,label_exp=!master #378781
  1. LocalFile.ImageSelector#PreviewSingleImage - Poshi Report - Poshi Summary - Console Output
2. AXIS_VARIABLE=1,label_exp=!master #378781
  1. LocalFile.ItemSelector#AddBlogsImageViaURL - Poshi Report - Poshi Summary - Console Output

Failures in common with acceptance upstream results at 9272e31:

test-portal-acceptance-pullrequest-batch(master)/modules-semantic-versioning-jdk8/0

Job Results:

0 Tests Passed.
1 Test Failed.

AXIS_VARIABLE=0,label_exp=!master #378779

Please fix semantic versioning on carloslancha/LPS-125413-migrate-image-selector.2

     [exec] Compiling JSP files of project ':apps:item-selector:item-selector-upload-web' with /opt/dev/projects/github/liferay-portal/bundles/tomcat-9.0.40/webapps/ROOT/WEB-INF/lib/util-taglib.jar as dependency in place of 'com.liferay.portal:com.liferay.util.taglib'
     [exec] 
     [exec] > Task :apps:item-selector:item-selector-upload-web:compileJSP
     [exec] 
     [exec] > Task :apps:item-selector:item-selector-web:generateJSPJava
     [exec] Compiling JSP files of project ':apps:item-selector:item-selector-web' with /opt/dev/projects/github/liferay-portal/bundles/tomcat-9.0.40/webapps/ROOT/WEB-INF/lib/util-taglib.jar as dependency in place of 'com.liferay.portal:com.liferay.util.taglib'
     [exec] Note: /opt/dev/projects/github/liferay-portal/modules/apps/item-selector/item-selector-web/build/jspc/org/apache/jsp/view_005fitem_005fselector_005fview_005fdescriptor_jsp.java uses unchecked or unsafe operations.
     [exec] Note: Recompile with -Xlint:unchecked for details.
     [exec] 
     [exec] > Task :apps:item-selector:item-selector-web:compileJSP
     [exec] 
     [exec] > Task :apps:item-selector:item-selector-upload-web:jar
     [exec] > Task :apps:item-selector:item-selector-upload-web:autoUpdateXml SKIPPED
     [exec] > Task :apps:item-selector:item-selector-upload-web:baseline SKIPPED
     [exec] > Task :apps:item-selector:item-selector-upload-web:syncVersions
     [exec] 
     [exec] > Task :apps:item-selector:item-selector-web:jar
     [exec] > Task :apps:item-selector:item-selector-web:autoUpdateXml SKIPPED
     [exec] > Task :apps:item-selector:item-selector-web:baseline SKIPPED
     [exec] > Task :apps:item-selector:item-selector-web:syncVersions
     [exec] Gradle build finished at 2021-02-11 15:44:29.158.
     [exec] 
     [exec] FAILURE: Build failed with an exception.
     [exec] 
     [exec] * What went wrong:
     [exec] Execution failed for task ':apps:item-selector:item-selector-taglib:baseline'.
     [exec] > A failure occurred while executing com.liferay.gradle.plugins.baseline.internal.work.BaselineWorkAction
     [exec]    > org.gradle.api.GradleException: Semantic versioning is incorrect while checking /opt/dev/projects/github/liferay-portal/tools/sdk/dist/com.liferay.item.selector.taglib-5.0.0.jar against /opt/dev/projects/github/liferay-portal/.gradle/caches/modules-2/files-2.1/com.liferay/com.liferay.item.selector.taglib/4.1.33/a3bf5bf4096100c1ee471d70507e6c555e596a81/com.liferay.item.selector.taglib-4.1.33.jar

carloslancha · 2021-02-11T16:28:57Z

Thx @boton yup, it looks like some ids were missing there since the creation of the component. Just added'em and pushed the commit ;)

carloslancha · 2021-02-11T16:29:06Z

ci:test:sf

liferay-continuous-integration · 2021-02-15T15:58:42Z

✔️ ci:test:stable - 9 out of 9 jobs passed

❌ ci:test:relevant - 21 out of 23 jobs passed in 2 hours 15 minutes

Click here for more details.

Base Branch:

Branch Name: master
Branch GIT ID: 7985dd55f78d0b4e4960d1b8b07158787e32d29f

Upstream Comparison:

Branch GIT ID: 7985dd55f78d0b4e4960d1b8b07158787e32d29f
Jenkins Build URL: Acceptance Upstream DXP (master) #1549

ci:test:stable - 9 out of 9 jobs PASSED

9 Successful Jobs:

ci:test:relevant - 21 out of 23 jobs PASSED

2 Failed Jobs:

21 Successful Jobs:

For more details click here.

Failures unique to this pull:

test-portal-acceptance-pullrequest-batch(master)/functional-tomcat90-mysql57-jdk8/0
Job Results:
50 Tests Passed.
1 Test Failed.
1. AXIS_VARIABLE=1,label_exp=!master #1111
  1. LocalFile.ImageSelector#PreviewSingleImage - Poshi Report - Poshi Summary - Console Output

For upstream results, click here.

liferay-continuous-integration · 2021-02-15T17:34:32Z

Jenkins Build:test-portal-acceptance-pullrequest(master)#4360
Jenkins Report:jenkins-report.html
Jenkins Suite: relevant
Pull Request:liferay-lima#1494
Spira Release:/Liferay DXP 7.4/Pull Request/ci:test:relevant
Spira Release Build:master - carloslancha > liferay-lima - PR#1494 - 2021-02-15[05:51:31]
Spira Jenkins Build:publish-spira-report#15688

nikki-pru · 2021-02-16T22:15:17Z

Hi @carloslancha, it looks like the changes to resources/image_selector/page.jsp, specifically around <div class="image-wrapper> could be causing the failure. If the change is intentional, the test might need a fix. I'll pull your branch now and send you the fix.

Sent the fix here - https://github.com/carloslancha/liferay-portal/pull/280

carloslancha · 2021-02-18T15:02:12Z

ci:test:relevant

liferay-continuous-integration · 2021-02-18T16:23:38Z

✔️ ci:test:stable - 9 out of 9 jobs passed

✔️ ci:test:relevant - 23 out of 23 jobs passed in 1 hour 20 minutes

Click here for more details.

Base Branch:

Branch Name: master
Branch GIT ID: 14013e30ddc196a32bec7e7d3ad31bc64eff58be

Upstream Comparison:

Branch GIT ID: 3a1328763cf4d2349d46f0a0674429df321a469f
Jenkins Build URL: Acceptance Upstream DXP (master) #1560

ci:test:stable - 9 out of 9 jobs PASSED

9 Successful Jobs:

ci:test:relevant - 23 out of 23 jobs PASSED

23 Successful Jobs:

For more details click here.

carloslancha · 2021-02-18T16:37:27Z

ci:forward

liferay-continuous-integration · 2021-02-18T16:37:31Z

CI is automatically triggering the following test suites:

ci:test:relevant
ci:test:sf

The pull request will automatically be forwarded to the user brianchandotcom if the following test suites pass:

ci:test:relevant
ci:test:sf
ci:test:stable

liferay-continuous-integration · 2021-02-18T16:37:34Z

Skipping previously passed test suites:
ci:test:relevant

liferay-continuous-integration · 2021-02-18T16:41:23Z

✔️ ci:test:sf - 1 out of 1 jobs passed in 47 minutes

Click here for more details.

Base Branch:

Branch Name: master
Branch GIT ID: 1110b647c2539d8b3ba1fff788333bb9e010f4e9

Sender Branch:

Branch Name: LPS-125413-migrate-image-selector.2
Branch GIT ID: 5c0eaea602397ca54c3e71570e129e3a4f33e102

1 out of 1jobs PASSED

1 Successful Jobs:

test-portal-source-format

For more details click here.

liferay-continuous-integration · 2021-02-18T16:41:39Z

All required test suite(s) passed.
Forwarding pullrequest to brianchandotcom.

liferay-continuous-integration · 2021-02-18T16:42:12Z

Pull request has been successfully forwarded to brianchandotcom#98928

liferay-continuous-integration · 2021-02-18T18:13:44Z

Jenkins Build:test-portal-acceptance-pullrequest(master)#7558
Jenkins Report:jenkins-report.html
Jenkins Suite: relevant
Pull Request:liferay-lima#1494
Spira Release:/Liferay DXP 7.4/Pull Request/ci:test:relevant
Spira Release Build:master - carloslancha > liferay-lima - PR#1494 - 2021-02-18[07:02:28]
Spira Jenkins Build:publish-spira-report#11838

liferay-continuous-integration · 2021-02-18T19:44:42Z

Jenkins Build:test-portal-source-format#3790
Jenkins Report:jenkins-report.html
Jenkins Suite: sf
Pull Request:liferay-lima#1494
Spira Release:/Liferay DXP 7.4/Pull Request/ci:test:sf
Spira Release Build:master - carloslancha > liferay-lima - PR#1494 - 2021-02-18[08:37:39]
Spira Jenkins Build:publish-spira-report#16070

Carlos Lancha added 4 commits February 11, 2021 13:54

LPS-125413 Move get imageURL logic to Tag. Deprecate draggableImage a…

c7b61db

…ttribute in favor of imageCropDirection. Add isDraggable logic to Tag.

LPS-125413 Update image selector jsp, removing no needed code in SSR …

dc8cc4c

…and using new ImageSelector react component

LPS-125413 Add missing class

0ea6ce1

LPS-125413 Get rid of useCallback usages since they're not needed. Re…

c3ff480

…name some methods to improve naming consistency. Add missing markup. Update props to fit new API from tag.

carloslancha requested a review from boton February 11, 2021 13:01

liferay-continuous-integration added ci:test:sf - pending ci:test:sf - success and removed ci:test:sf - pending labels Feb 11, 2021

carloslancha requested a review from 4lejandrito February 11, 2021 13:30

4lejandrito approved these changes Feb 11, 2021

View reviewed changes

liferay-continuous-integration added ci:test:relevant - pending ci:test:stable - pending labels Feb 11, 2021

boton added the bug label Feb 11, 2021

liferay-continuous-integration added ci:test:relevant - failure ci:test:stable - success and removed ci:test:relevant - pending ci:test:stable - pending labels Feb 11, 2021

LPS-125413 Added missing ids

3857d88

liferay-continuous-integration removed the ci:test:sf - success label Feb 11, 2021

liferay-continuous-integration added the ci:test:stable - success label Feb 15, 2021

LPS-125413 Fix path due to changes to image_selector/page.jsp

5c0eaea

liferay-continuous-integration added ci:test:relevant - pending ci:test:stable - pending ci:test:relevant - success ci:test:stable - success and removed ci:test:relevant - failure ci:test:stable - success ci:test:relevant - pending ci:test:stable - pending labels Feb 18, 2021

liferay-continuous-integration added ci:test:sf - pending ci:test:sf - success and removed ci:test:sf - success ci:test:sf - pending labels Feb 18, 2021

liferay-continuous-integration mentioned this pull request Feb 18, 2021

LPS-125413 Use new ImageSelector component in image-selector tag and remove old one brianchandotcom/liferay-portal#98928

Closed

liferay-continuous-integration closed this Feb 18, 2021

carloslancha deleted the LPS-125413-migrate-image-selector.2 branch February 24, 2023 00:41

LPS-125413 Use new ImageSelector component in image-selector tag and remove old one #1494

LPS-125413 Use new ImageSelector component in image-selector tag and remove old one #1494

Conversation

carloslancha commented Feb 11, 2021 • edited

liferay-continuous-integration commented Feb 11, 2021

carloslancha commented Feb 11, 2021

liferay-continuous-integration commented Feb 11, 2021

✔️ ci:test:sf - 1 out of 1 jobs passed in 4 minutes

Base Branch:

Sender Branch:

For more details click here.

carloslancha commented Feb 11, 2021

liferay-continuous-integration commented Feb 11, 2021

boton commented Feb 11, 2021

boton commented Feb 11, 2021 • edited

liferay-continuous-integration commented Feb 11, 2021

✔️ ci:test:stable - 9 out of 9 jobs passed

❌ ci:test:relevant - 18 out of 23 jobs passed in 2 hours 28 minutes

Base Branch:

Upstream Comparison:

5 Failed Jobs:

For more details click here.

Failures unique to this pull:

test-portal-acceptance-pullrequest-batch(master)/functional-tomcat90-mysql57-jdk8/0

Job Results:

test-portal-acceptance-pullrequest-batch(master)/modules-semantic-versioning-jdk8/0

Job Results:

carloslancha commented Feb 11, 2021

carloslancha commented Feb 11, 2021

liferay-continuous-integration commented Feb 15, 2021

✔️ ci:test:stable - 9 out of 9 jobs passed

❌ ci:test:relevant - 21 out of 23 jobs passed in 2 hours 15 minutes

Base Branch:

Upstream Comparison:

2 Failed Jobs:

For more details click here.

Failures unique to this pull:

test-portal-acceptance-pullrequest-batch(master)/functional-tomcat90-mysql57-jdk8/0

Job Results:

For upstream results, click here.

liferay-continuous-integration commented Feb 15, 2021

nikki-pru commented Feb 16, 2021 • edited

carloslancha commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

✔️ ci:test:stable - 9 out of 9 jobs passed

✔️ ci:test:relevant - 23 out of 23 jobs passed in 1 hour 20 minutes

Base Branch:

Upstream Comparison:

For more details click here.

carloslancha commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

✔️ ci:test:sf - 1 out of 1 jobs passed in 47 minutes

Base Branch:

Sender Branch:

For more details click here.

liferay-continuous-integration commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

liferay-continuous-integration commented Feb 18, 2021

carloslancha commented Feb 11, 2021 •

edited

boton commented Feb 11, 2021 •

edited

nikki-pru commented Feb 16, 2021 •

edited