Invalid URL Fix: Decoding manually for some reserved characters

[this-is-shivamsingh]

Reference PR: #1664

• While testing the previous PR, we found for 11/18 reserved characters, JS neither encodes/decodes this.
• When a user gives original characters like # : /, then we don't have an issue, but if user given an encoded value of these characters, it does get's not decoded, and while encoding the % part of get encoded again

decodeURI('%23') -> output: %23
encodeURI('%23') -> output: %2523

• To resolve this issue we are decoding these encoded characters manually.
• General public URLs/endpoints are not like this, but if someone is using a localhost, and hosted a file(containing this encoded value) for taking a snapshot then creates an issue, when the response is 404 after modifying the URL.
• We tested for all reserved and unreserved characters from the official Wikipedia docs(https://en.wikipedia.org/wiki/Percent-encoding) and only found these 11 characters that were causing this issue.

Changes:

• Manually decoding some reserved characters.
• A feature flag to disable this modification in case user encounter some issues with this.

List of all reserved characters for which decodeURI, doesn't work.

# -> %23
$ -> %24
: -> %3A
& -> %26
+ -> %2B
, -> %2C
/ -> %2F
; -> %3B
= -> %3D
? -> %3F
@ -> %40

---

Revisiting solution for the above issue with an update:

1. While decoding manually for reserved characters we found that if a file system is hosted locally, and if the filename contains ? and #, then the browser converts them to their encoded form.
2. Suppose a file - abd?s.html is hosted locally then the browser opens this file as http://localhost:9000/abd%3Fs.html, now once we decode it manually, it becomes http://localhost:9000/abd?s.html that is a valid file path, but the browser is not able to recognise it and return 404, because for ? browser think it to be a query params, but it is actually a filename, so it only accepts the encoded value of it.
3. It is happening for ? and # only out of all reserved characters. And only happens for if a file name contains these 2 reserved characters.
4. To solve generically and for all reserved characters, we are just neither encoding nor decoding the reserved characters from the above list, so if the URL contains an encoded value of a reserved character, it just used as it is, without changing it. We preserve the encoded reserved characters from being encoding/decoding.

Changes:

1. We just replace the encoded reserved character with a placeholder value and once after encoding/decoding is done we replace placeholder values with their encoded reserved character so that nothing is changed for encoded reserved characters

[pankaj443]

LGTM

[this-is-shivamsingh]

• We are adding a snapshot url there, to use it in network.js

[this-is-shivamsingh]

• Since snapshot.url also goes via network.js, so if snapshot.url is invalid the error message is already been shown before so no need to show again. Only show for assets urls

[this-is-shivamsingh]

Using __PERCY_PLACEHOLDER_0__ as a placeholder, as these alphanumerical and _ doesn't get encoded as it is a part of a valid URL and not a part of reserved characters.

[rishigupta1599]

LGTM