Skip to content
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

Product description not correctly truncated #10685

Closed
filipefurtad0 opened this issue Apr 11, 2023 · 7 comments · Fixed by #12635 or #13124
Closed

Product description not correctly truncated #10685

filipefurtad0 opened this issue Apr 11, 2023 · 7 comments · Fixed by #12635 or #13124
Labels
bug-s4 The bug is annoying, but doesn't prevent from using the platform. Not so many users are impacted. good first issue hackathon Issues for upcoming hackathons papercut Labels papercuts after they've moved from the "Papercuts prioritized" column

Comments

@filipefurtad0
Copy link
Contributor

filipefurtad0 commented Apr 11, 2023 •
edited
Loading

Description

Relates to #10537.

If a product description is set without any line breaks, then the three dots ... are not displayed correctly when truncating it in the shopfront.

EDIT

The text is incorrectly truncated not only in width but also in length, as discussed here.

Expected Behavior

A long product description should be truncated correctly (even if it has no line breaks).

Actual Behaviour

If a product description is set without any line breaks, then the three dots ... are not displayed correctly when truncating it in the shopfront.

Steps to Reproduce

As admin
0. Log in as an enterprise shop and create shipping/payment methods, and then create two products (1. and 2.) and edit the descriptions respectively:

  1. Incorrectly truncated text in width: Set Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi venenatis metus diam, eget scelerisque nibh auctor non. Vestibulum tempor non dolor id luctus. as a product description.

  2. Incorrectly truncated text in length: Set
    <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi venenatis metus diam, eget scelerisque nibh auctor non.</div><p><br/></p><p>Vestibulum tempor non dolor id luctus.<br/></p><p><br/></p> as a product description.

  3. Create an order cycle and add the the two products to it. If the order cycle is open, these should be visible in the shopfront. More info on the userguide.

As customer
4. Visit the shopfront: notice the inconsistent text truncation both in width and length

Please note: this scenario reproduced the S2 regression and requires manual testing of PRs, for this issue.

Animated Gif/Screenshot

Incorrect truncation in width:
image

Incorrect truncation in length:
image

Workaround

Add line-breaks to your product description. Details here.

Severity

bug-s3: a feature is broken but there is a workaround

Your Environment

  • Version used: v4.3.2
  • Browser name and version: Firefox 110
  • Operating System and version (desktop or mobile): Ubuntu 22.04

Possible Fix
@filipefurtad0 filipefurtad0 added the bug-s3 The bug is stopping a critical or non-critical feature but there is a usable workaround. label Apr 11, 2023
@filipefurtad0 filipefurtad0 mentioned this issue Apr 11, 2023
Merged
@RachL RachL added the bug-s4 The bug is annoying, but doesn't prevent from using the platform. Not so many users are impacted. label Apr 12, 2023
@RachL
Copy link
Contributor

RachL commented Apr 12, 2023

I'm lowering this to S4 considering #10537 was only an s4.

@RachL RachL removed the bug-s3 The bug is stopping a critical or non-critical feature but there is a usable workaround. label Apr 12, 2023
@sumedhavs
Copy link

Hi, I am newer to this project and was having trouble replicating this locally.

Attached first is how I found this issue on the shopfront as a customer:
ActualWebsite

Attached second and below is the farthest I got to replicated it locally. I wasn't able to find a way to add the description and add it to an open OC which I think means an order cycle? Any help would be appreciated!
LocalWebsite

@filipefurtad0
Copy link
Contributor Author

Hey @sumedhavs , welcome 🎉

OC which I think means an order cycle?

Yes - I've updated the description above, with more detailed steps, on how to reproduce the issue. I hope this helps!

@sumedhavs
Copy link

sumedhavs commented Apr 18, 2023 •
edited
Loading

Thank you so much, I was able to replicate it! I can work on this issue :)

@sumedhavs
Copy link

sumedhavs commented Apr 18, 2023 •
edited
Loading

Just submitted a Pull Request for this issue, #10721. Appreciate if you can review at your earliest convenience!

@drummer83 drummer83 mentioned this issue Apr 18, 2023
Closed
@RachL RachL added the hackathon Issues for upcoming hackathons label Sep 25, 2023
@sigmundpetersen sigmundpetersen moved this to To triage (By the maintainers) in Welcome New Developers! Sep 27, 2023
@dacook dacook moved this from To triage (By the maintainers) to Frontend Easy in Welcome New Developers! Sep 27, 2023
@dacook
Copy link
Member

dacook commented Sep 27, 2023

It looks like this was basically done in the attached PR, but a browser (capybara) spec needs adjusting to cater for this.

@github-project-automation github-project-automation bot moved this to All the things in OFN Delivery board Feb 16, 2024
@RachL RachL added the papercut Labels papercuts after they've moved from the "Papercuts prioritized" column label May 23, 2024
@wandji20 wandji20 mentioned this issue Jul 1, 2024
Merged
2 tasks
@sigmundpetersen sigmundpetersen moved this from Frontend Easy to In progress in Welcome New Developers! Jul 2, 2024
@sigmundpetersen sigmundpetersen moved this from All the things 💤 to In Progress ⚙ in OFN Delivery board Jul 2, 2024
@github-project-automation github-project-automation bot moved this from In progress to Done in Welcome New Developers! Jul 9, 2024
@github-project-automation github-project-automation bot moved this from In Progress ⚙ to Done in OFN Delivery board Jul 9, 2024
rioug added a commit to rioug/openfoodnetwork that referenced this issue Jul 22, 2024
@rioug
Revert fix introduced in openfoodfoundation#10685
7f9bbd2 
It breaks wit Safari on Iphone
@rioug rioug mentioned this issue Jul 22, 2024
Merged
4 tasks
@filipefurtad0
Copy link
Contributor Author

Re-opening this one, as per #12694.

@filipefurtad0 filipefurtad0 reopened this Jul 22, 2024
@github-project-automation github-project-automation bot moved this from Done to Dev ready 👋 in OFN Delivery board Jul 22, 2024
@github-project-automation github-project-automation bot moved this from Done to To triage (By the maintainers) in Welcome New Developers! Jul 22, 2024
filipefurtad0 pushed a commit to filipefurtad0/openfoodnetwork that referenced this issue Jul 24, 2024
@rioug @filipefurtad0
Revert fix introduced in openfoodfoundation#10685
f0f88f7 
It breaks wit Safari on Iphone
@sigmundpetersen sigmundpetersen moved this from To triage (By the maintainers) to Frontend Easy in Welcome New Developers! Aug 14, 2024
@Yassir4 Yassir4 mentioned this issue Feb 5, 2025
Merged
4 tasks
@github-project-automation github-project-automation bot moved this from Frontend Easy to Done in Welcome New Developers! Feb 7, 2025
@github-project-automation github-project-automation bot moved this from All the things 💤 to Done in OFN Delivery board Feb 7, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug-s4 The bug is annoying, but doesn't prevent from using the platform. Not so many users are impacted. good first issue hackathon Issues for upcoming hackathons papercut Labels papercuts after they've moved from the "Papercuts prioritized" column
Projects
OFN Delivery board
Status: Done
Welcome New Developers!
Status: Done
Milestone
No milestone
5 participants
@jibees @dacook @RachL @filipefurtad0 @sumedhavs