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

SDK: better support for SPA routing - STEP 2/2 : filter out html anchor tags changes #466

Conversation

mquentin
Copy link
Member

@mquentin mquentin commented Jul 27, 2020

Motivation

Given
startViewCollection
When
on window.location.hash changes
Then
check if the views are different.
If the hash fragment has changed and that it is not an Anchor nav, then the views are different.

Changes

  • ✨ add a noAnchorNavHashChange check in the trackHash function that check if there is an equivalent id on one of the HTML elements

Testing

✅ test added that check if the hashchange is related to an Anchor nav

@codecov-commenter
Copy link

codecov-commenter commented Jul 27, 2020

Codecov Report

Merging #466 into maxime.quentin/betterSupportForSPArouting will increase coverage by 0.32%.
The diff coverage is 100.00%.

Impacted file tree graph

@@                              Coverage Diff                              @@
##           maxime.quentin/betterSupportForSPArouting     #466      +/-   ##
=============================================================================
+ Coverage                                      87.35%   87.67%   +0.32%     
=============================================================================
  Files                                             32       32              
  Lines                                           2024     2028       +4     
  Branches                                         410      410              
=============================================================================
+ Hits                                            1768     1778      +10     
+ Misses                                           256      250       -6     
Impacted Files Coverage Δ
packages/rum/src/viewCollection.ts 96.15% <100.00%> (+0.15%) ⬆️
packages/rum/src/parentContexts.ts 100.00% <0.00%> (+1.85%) ⬆️
packages/rum/src/rum.ts 90.90% <0.00%> (+4.13%) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 37597fd...1f809c3. Read the comment docs.

@mquentin mquentin marked this pull request as ready for review July 27, 2020 12:19
@mquentin mquentin requested a review from a team as a code owner July 27, 2020 12:19
@mquentin mquentin changed the base branch from master to maxime.quentin/betterSupportForSPArouting July 27, 2020 12:20
@mquentin mquentin changed the title Maxime.quentin/better support for sp arouting filter out anchor nav SDK: better support for SPA routing - STEP 2/2 : filter out html anchor tags changes Jul 27, 2020
@mquentin mquentin changed the base branch from maxime.quentin/betterSupportForSPArouting to maxime.quentin/betterSupportForSPAroutingAddhashTracking July 28, 2020 08:17
Base automatically changed from maxime.quentin/betterSupportForSPAroutingAddhashTracking to maxime.quentin/betterSupportForSPArouting July 28, 2020 12:38
@bits-bot
Copy link

bits-bot commented Jul 28, 2020

CLA assistant check
All committers have signed the CLA.

…quentin/betterSupportForSPAroutingFilterOutAnchorNav
packages/rum/src/viewCollection.ts Outdated Show resolved Hide resolved
packages/rum/src/viewCollection.ts Show resolved Hide resolved
packages/rum/src/viewCollection.ts Outdated Show resolved Hide resolved
test/e2e/scenario/agents.scenario.ts Outdated Show resolved Hide resolved
test/e2e/scenario/agents.scenario.ts Outdated Show resolved Hide resolved
Comment on lines 51 to 53
// Anchor navigations would modify the location without generating a new view.
// These changes need to be acknowledged so they don't interfer with the next change areDifferentViews call
currentLocation = { ...location }
Copy link
Contributor

Choose a reason for hiding this comment

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

What about enforcing that by a unit test?


it('should acknowledge the view location hash change after an Anchor navigation', (done) => {
const { lifeCycle } = setupBuilder.build()
const spyObj = mockGetElementById()
Copy link
Contributor

Choose a reason for hiding this comment

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

what about something more expressive than spyObj?

Copy link
Member Author

@mquentin mquentin Jul 30, 2020

Choose a reason for hiding this comment

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

as we just "clear" it, I did not look for a better name. Also the comment helps understanding the usage of spyObj.and.callThrough()

Copy link
Contributor

Choose a reason for hiding this comment

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

it could have been an opportunity to be more expressive

@mquentin mquentin merged commit 0ca4e32 into maxime.quentin/betterSupportForSPArouting Jul 30, 2020
bcaudan added a commit that referenced this pull request Aug 4, 2020
* SDK: better support for SPA routing - STEP 1/2 : add hash tracking (#463)

* add hash tracking

* ✅ add hash change tests

* introduce renewViewOnChange

* add better management and comments of the areViewDifferent hash part

* set async tests for hashchanges

* reset window.location.hash of previous tests

* skip tesst using Promise for IE

* replace jasmine promise with callback process

* remove anchor check on this PR

* ✅ and implem reviews

* SDK: better support for SPA routing - STEP 2/2 : filter out html anchor tags changes (#466)

* add hash tracking

* ✅ add hash change tests

* introduce renewViewOnChange

* add better management and comments of the areViewDifferent hash part

* set async tests for hashchanges

* reset window.location.hash of previous tests

* skip tesst using Promise for IE

* replace jasmine promise with callback process

* remove anchor check on this PR

* add anchor nav filter

* patch tslint error

* ✅ and implem reviews

* implement reviews regarding func naming and hash cleaning

* simplify mockGetElementById

* add e2e tests

* simply anchor filter out proccess

* implement reviews

* unit test the hash change acknowledgement after an anchor nav

* fix typo

* fix typo v2

* fix mock hash

Co-authored-by: Bastien Caudan <[email protected]>
@bcaudan bcaudan deleted the maxime.quentin/betterSupportForSPAroutingFilterOutAnchorNav branch August 5, 2020 08:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants