RedirectRequestHandler performAuthorizationRequest method - How to safely pass base64 encoded string as query parameter value?

[jbdoster]

Expected Behavior

Given a key/value pair preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ==" is passed into the extras scope of the AuthorizationRequest constructor
When the RedirectRequestHandler calls buildRequestUrl
Then the query parameter in the URL is &preselectedExternalProvider=YmFzZTY0IHN0cmluZyB2YWx1ZQ==

[REQUIRED] Describe expected behavior

I expect base64 strings to be passed as query parameters safely (without special character encoding)

Describe the problem

The == delimiter is being encoded in the authorization request URL created by buildRequestUrl within the performAuthorizationRequest call

[REQUIRED] Actual Behavior

Given a key/value pair preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ==" is passed into the extras scope of the AuthorizationRequest constructor
When the RedirectRequestHandler calls buildRequestUrl
Then the query parameter in the URL is &preselectedExternalProvider=YmFzZTY0IHN0cmluZyB2YWx1ZQ%3D%3D

[REQUIRED] Steps to reproduce the behavior

1. Construct the authorization request using the AuthorizationRequest constructor
   a. add this key/value pair in the extras scope: preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ=="
2. Use this request and call performAuthorizationRequest
3. Check the preselectedExternalProvider query parameter's value in the network tab after being redirected

[REQUIRED] Environment

• AppAuth-JS version: 1.3.1
• AppAuth-JS Environment (Node, Browser (UserAgent), ...): Browser (React)
• Source code snippts (inline or JSBin)

    let request = new AuthorizationRequest({
      client_id: config.client_id,
      redirect_uri: config.redirect_uri,
      scope: config.scope,
      response_type: AuthorizationRequest.RESPONSE_TYPE_CODE,
      state: undefined,
      extras: {
        access_type: "offline",
        prompt: "consent",
        grant_type: GRANT_TYPE_AUTHORIZATION_CODE,
        preselectedExternalProvider: config.preselectedExternalProvider,
      },
    });

    if (this.configuration) {
      this.authorizationHandler.performAuthorizationRequest(
        this.configuration,
        request
      );
    } else {
      console.log(
        "Fetch Authorization Service configuration, before you make the authorization request."
      );
    }

[jbdoster]

I guess really it would be part of this util:

AppAuth-JS/src/query_string_utils.ts

Line 55 in 39a21ad

stringify(input: StringMap) {

We could first test if the string value input[key] is base64 encoded, and if so, assign the value without encoding