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

A recent update removes "=" in $route.query #8603

Closed
joffreyBerrier opened this issue Jan 7, 2021 · 2 comments
Closed

A recent update removes "=" in $route.query #8603

joffreyBerrier opened this issue Jan 7, 2021 · 2 comments

Comments

@joffreyBerrier
Copy link
Sponsor

joffreyBerrier commented Jan 7, 2021

Versions

  • nuxt: 2.14.12
  • node: 15.4.0

Reproduction

I use algolia on a nuxt application, and I push the currentFilter in the url:

this.$router.push({ query: { numericFilters: 'capacity >= 5' } })

The url is then : http://localhost:3000/fr/recherche?numericFilters=capacity%20%3E%3D%205
On refresh, server-side with asyncData I get the query with route.query

  • in v2.14.10 the decoded result was capacity >= 5
  • In your current version the result is capacity >

On url decode https://www.freeformatter.com/url-encoder.html#ad-output
The result is capacity >= 5

The cause might come from your HotFix #8494 named Fix issues with URL handling (resolves #8497, #8493, #8458, #8457)

Additional Details

Steps to reproduce

Steps to reproduce

The $route.query return { "numericFilters": "capacity >= 5" }
The querySsr return { "numericFilters": "capacity >" }

<template>
  <div>
    <button @click="addQuery">Add query on url</button>
    <p>
      Query on clientSide : <strong>{{ $route.query }}</strong>
    </p>
    <p>
      Query on ssr : <strong>{{ querySsr }}</strong>
    </p>
  </div>
</template>

<script>
export default {
  asyncData({ route }) {
    // eslint-disable-next-line no-console
    console.log(route.query)

    return {
      querySsr: route.query,
    }
  },
  data() {
    return {
      isOpen: false,
    }
  },
  methods: {
    addQuery() {
      this.$router.push({ query: { numericFilters: 'capacity >= 5' } })
    },
  },
}
</script>

<style>
div {
  height: 100vh;
  width: 100vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
button,
p {
  margin: 0 auto 15px;
}
</style>

Capture d’écran 2021-01-07 à 14 33 17

What is Expected?

Return the result of the UrlDecode => { "numericFilters": "capacity >= 5" } like before

What is actually happening?

@pi0
Copy link
Member

pi0 commented Jan 7, 2021

Hi @joffreyBerrier. Issue with parsing = in query values resolved in ufo@0.5.3. Would you please try upgrading with yarn upgrade nuxt or npm up nuxt and try again? (locally testing, issue seems fixed so closing issue but please ping if not to investigate)

@pi0 pi0 closed this as completed Jan 7, 2021
@Djules
Copy link

Djules commented Jan 15, 2021

Just for the record, it fixed issue for me with Prismic preview mode in @nuxtsj/prismic module (the "websitePreviewId=" part from the token URL parameter was lost when converted to query parameter in nuxt context.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants