Error during parseHash: Cannot read properties of undefined (reading 'alg')

[cjohnson]

In Cypress, I’m working on our programmatic login functionality, and I’m at the final step:

Routing the application to a URL with the proper hash so our auth0 integration can parse window.location.hash → handleAuthentication → setSession in the created hook (using auth0.js. However, during handleAuthentication, parseHash is throwing the following error: TypeError: Cannot read properties of undefined (reading 'alg'). What’s strange is the log “insidepromise” fires, but “insideparshhash” does not, yet, I’m positive this is where the error is coming from. Here is the format of the URL I’m visiting via Cypress: const callbackUrl = '${Urls.APP_URL}/#access_token=${access_token}&scope=openid%20%profile%20%email&id_token=${id_token}&expires_in=${expires_in}&token_type=Bearer&state=${auth0State.state}' (ignore ’ with the string literal).

at auth0.min.esm.js:8:169459
    at auth0.min.esm.js:8:170685
    at push../node_modules/auth0-js/dist/auth0.min.esm.js.I.verify (auth0.min.esm.js:8:127349)
    at push../node_modules/auth0-js/dist/auth0.min.esm.js.WebAuth.validateToken (auth0.min.esm.js:8:170641)
    at push../node_modules/auth0-js/dist/auth0.min.esm.js.WebAuth.validateAuthenticationResponse (auth0.min.esm.js:8:168446)
    at push../node_modules/auth0-js/dist/auth0.min.esm.js.WebAuth.parseHash (auth0.min.esm.js:8:166511)
    at auth0Plugin.js:183:24
    at new Promise (<anonymous>)
    at Vue.handleAuthentication (auth0Plugin.js:181:16)
    at Vue.created (auth0Plugin.js:76:22)

      async handleAuthentication () {
        this.loading = true

        return new Promise((resolve, reject) => {
          console.log('insidepromise')
          this.webAuth.parseHash((error, authResult) => {
            console.log('insideparsehash')
            if (error || (!authResult || !authResult.idToken)) {
              this.error = error

              ...

              return reject(error)
            }
            resolve(authResult)
          })
        }).then(async (authResult) => {
          await this.setSession(authResult)
          this.loading = false
        })
      },

[cjohnson]

I’ve been doing a bit of digging, and I BELIEVE the error comes from lines 448-450 of the WebAuth.prototype.validateAuthenticationResponse function in web-auth/index.js.

      // if the alg is not HS256, return the raw error
      if (decodedToken.header.alg !== 'HS256') {
        return callback(validationError);
      }

What I don’t understand is where the header.alg value comes from, because it’s not a value available when you redirect from the auth0 login page when using our application.

[cjohnson]

Solved it - I didn’t have scope set in my request to authenticate programmatically, so it wasn’t returning an id_token.