The problem:
The screen reader NVDA reads the previous page even after successful navigation to the next page. I am using react-router-dom for navigation and when I use history.push() command to navigate to the next page, it still reads the text from the previous page in NVDA screen reader although that page is not visible on the screen and this issue is only replicable in google chrome browser.
I do not know for sure but I noticed this after a recent update of multiple packages.
Please note that this only happens when I am using push command and when using Links of react-router-dom it is working as expected and it also works fine in Mozilla Browser
Here are the versions used:
React: "^16.8.4",
react-dom: "^16.8.4",
react-router-dom: "^4.3.1",
react-scripts: "^3.4.0",
google chrome: Version 80.0.3987.132 (Official Build) (64-bit),
NVDA (Screen Reader): 2019.2.1
Expected result: NVDA screen reader should Only read the current page after navigating to a certain page and should not read the text/button(or any elements) of the previous page after navigating away.
Actual Result: NVDA screen reader reads the previous page elements after navigation in Google Chrome.
Thank you for Helping