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.

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

Improve insurance integration stability & prevent unnecessary reloading of widget #591

Merged
merged 3 commits into from
Oct 30, 2024

Conversation

olance
Copy link
Contributor

@olance olance commented Oct 25, 2024

Reason for change

In some versions of PrestaShop (here, 1.7.2.4), the insurance widget is reloaded in an infinite loop:

Enregistrement.de.l.ecran.2024-10-23.a.21.16.35.mov

In some other versions (e.g. 1.7.0.6) the reloading only inexplicably happens once instead of infinitely, i.e. 2 consecutive loading of the widget, so 1 extra load.

The root cause for both seems to be the use of PrestaShop events paired with messaging management from the widget iframe.

As a side effect, the whole product details & add to cart section of the product page is reloaded unnecessarily, including our BNPL widget, which makes the sidebar's height jump up & down.

Fixes ECOM-2184

Code changes

  • Started by documenting existing code to better grasp its inner workings
  • Then simplified it and refactored the control flow to isolate the code handling prestashop-initiated events from widget-initiated events. This way we only listen to prestashop events to trigger necessary refreshes, and handle widget events without reloading the PrestaShop UI unnecessarily.

How to test

As a reviewer, you are encouraged to test the PR locally.

Before making the present changes, I noted different behaviours/bugs depending on different PS versions:

  • 1.7.0.6
  • 1.7.2.4
  • 1.7.8.7

With this PR, the integration should behave the same in all versions and the following issues should not be visible anymore:

  • Insurance modale not always showing on add to cart event:
    • Click on an insurance option in the widget: the modal opens up
    • Close the modal by choosing "I don't want to protect my purchase"
    • Click on "Add to cart": ❌ the modal does not open and the product is added to the cart immediately
  • Initial load of the widget happens twice:
    • Open the page of an eligible product
    • ❌ The widget is displayed, and then reloaded once
      • This is noticeable as the BNPL widget will "blink" and the height of the right section thus changes temporarily
      • On PS 1.7.2.4, because of a different reloading behaviour from PS, the reload loop is infinite as seen on the above video
  • The modal sometimes "ignores" the quantity > 1:
    • Increase the quantity wanted for a product
    • Click on an insurance option in the widget (the bug does not show when clicking Add to Cart)
    • Click on "Protect my purchase" in the modal
      • ❌ The modal closes without offering to protect one or multiple products, despite the quantity being > 1

Checklist for authors and reviewers

  • The title of the PR uses business wording, not technical jargon, for the changelog readers to understand it
  • The PR implements the changes asked in the referenced task / issue
  • You understand the impact of this PR on existing code/features

Non applicable

  • The automated tests are compliant with the testing strategy
  • The tests are relevant, and cover the corner/error cases, not only the happy path
  • The changes include adequate logging and Datadog traces
  • Documentation is updated (API, developer documentation, ADR, Notion...)

Some versions of PS (e.g. 1.7.2.4) will completely reload the product actions DOM, causing the widget to fully reload and loose its state.
As a result, the insurance modal always uses a quantity=1 when opened via the widget.

Including the quantity in the URL fixes that
PrestaShop events are not manually triggered anymore, as we really only need to listen to them, so that we can trigger some update flows.
The rest of the control flow remains handled at the message event handler level, which removes unnecessary reloads and fixes a few other bugs
@olance olance requested a review from a team as a code owner October 25, 2024 13:51
Copy link

⏳E2E tests are currently running.
➡️ You can follow their progression here.

Copy link

sonarcloud bot commented Oct 25, 2024

Copy link

❌ E2E tests have failed.
➡️ You can find the results here.

@olance olance merged commit ad0cf10 into develop Oct 30, 2024
5 of 6 checks passed
@olance olance deleted the fix/infinite-reload branch October 30, 2024 08:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants