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

fix(encodeQueryValue): encode the slash character #198

Merged

Conversation

hexrw
Copy link
Contributor

@hexrw hexrw commented Dec 22, 2023

πŸ”— Linked issue

Issue #196

❓ Type of change

  • πŸ“– Documentation (updates to the documentation, readme, or JSdoc annotations)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • πŸ‘Œ Enhancement (improving an existing functionality like performance)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

πŸ“š Description

Make function encodeQueryValue also encode the slash character so that it's consistent with the native URL interface and tools. Resolves #196

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

Make function `encodeQueryValue` also encode the slash character so that it's consistent with the native URL interface and tools
@pi0 pi0 changed the title bugfix(encoding): Make encodeQueryValue encode the slash character fix(encodeQueryValue): encode the slash character Dec 23, 2023
@pi0
Copy link
Member

pi0 commented Dec 23, 2023

Can you please add tests and also (manually) confirm if new URL().href has the same behavior for doing encoding? πŸ™πŸΌ

@hexrw
Copy link
Contributor Author

hexrw commented Dec 24, 2023

Before this fix

Tested in Node 20 and Firefox 120

// setting the `new $URL().query` object

import { $URL } from "ufo"

const url = new $URL("https://example.com/")
url.query = { foo: "bar/egg" }

console.log(url.toString())  // "https://example.com/?foo=bar/egg"
console.log(url.href)  // "https://example.com/?foo=bar/egg"
// assigning a property to the `new $URL().query` object

import { $URL } from "ufo"

const url = new $URL("https://example.com/")
url.query = { foo: "bar/egg" }

console.log(url.toString())  // "https://example.com/?foo=bar/egg"
console.log(url.href)  // "https://example.com/?foo=bar/egg"
// using the `$URL` constructor(s) and pre-encoding slashes inside query parameter values

import { $URL } from "ufo"

const url = new $URL("https://example.com/?foo=bar%2Fegg")

// slashes get decoded!
console.log(url.toString())  // "https://example.com/?foo=bar/egg"
console.log(url.href)  // "https://example.com/?foo=bar/egg"
// using the `$URL` constructor(s) and not encoding slashes inside query parameter values

const url = new $URL("https://example.com/?foo=bar/egg")

console.log(url.toString())  // "https://example.com/?foo=bar/egg"
console.log(url.href)  // "https://example.com/?foo=bar/egg"

After this fix

Tested in Node 20 and Firefox 120

// setting the `new $URL().query` object

import { $URL } from "ufo"

const url = new $URL("https://example.com/")
url.query = { foo: "bar/egg" }

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"
// assigning a property to the `new $URL().query` object

import { $URL } from "ufo"

const url = new $URL("https://example.com/")
url.query = { foo: "bar/egg" }

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"
// using the `$URL` constructor(s) and pre-encoding slashes inside query parameter values

import { $URL } from "ufo"

const url = new $URL("https://example.com/?foo=bar%2Fegg")

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"
// using the `$URL` constructor(s) and not encoding slashes inside query parameter values

const url = new $URL("https://example.com/?foo=bar/egg")

// see the note below
console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"

Native behavior

Tested in Node 20 and Firefox 120

// using the `new URL().search` Map and `new URLSearchParams().toString()`

const url = new URL("https://example.com/")
url.search = new URLSearchParams({ foo: "bar/egg" }).toString()

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"
// using `new URL().searchParams`

const url = new URL("https://example.com/")
url.searchParams.set("foo", "bar/egg")

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"
// using the `URL` constructor(s) and pre-encoding slashes inside query parameter values

const url = new URL("https://example.com/?foo=bar%2Fegg")

console.log(url.toString())  // "https://example.com/?foo=bar%2Fegg"
console.log(url.href)  // "https://example.com/?foo=bar%2Fegg"

NOTE: The native URL interface does not encode slashes when passing them unencoded to the constructor(s)

// using the `URL` constructor(s) and not encoding slashes inside query parameter values

const url = new URL("https://example.com/?foo=bar/egg")

console.log(url.toString())  // "https://example.com/?foo=bar/egg"
console.log(url.href)  // "https://example.com/?foo=bar/egg"

@hexrw
Copy link
Contributor Author

hexrw commented Dec 24, 2023

@pi0 my previous comment contains all results from my manual testing. Those did not seem to me as needing to be given separate unit tests, and you said to test it manually anyway.

Also, I will now commit changes to the unit tests for encoding and normalization, which now pass as they expect the new adjusted behavior

@hexrw
Copy link
Contributor Author

hexrw commented Jan 30, 2024

@pi0 needs attention

Copy link
Member

@pi0 pi0 left a comment

Choose a reason for hiding this comment

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

Thanks! ❀️

@pi0 pi0 merged commit 47f4070 into unjs:main Feb 5, 2024
@hexrw hexrw deleted the bugfix/issue-196/encode-query-value-encode-slash branch February 6, 2024 19: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.

Query parameter encoding - slash character does not get encoded
2 participants