intercepted request query object missing

[WORMSS]

Current behavior

query is blank, though not what it says in the docs or type.

https://docs.cypress.io/api/commands/intercept#Request-object-properties

Desired behavior

Have this filled in so I can assert on it.

Test code to reproduce

Repo with test : https://github.com/WORMSS/cypress-intercept-query-empty

Cypress Version

11.2.0 and 12.0.2

Node version

19.0.1

Operating System

Windows

Debug Logs

====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:        12.0.2                                                                         │
  │ Browser:        Electron 106 (headless)                                                        │
  │ Node Version:   v19.0.1 (C:\Users\CRichardson\nodejs\node.exe)                                 │
  │ Specs:          1 found (spec.cy.js)                                                           │
  │ Searched:       cypress/e2e/**/*.cy.{js,jsx,ts,tsx}                                            │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


────────────────────────────────────────────────────────────────────────────────────────────────────

  Running:  spec.cy.js                                                                      (1 of 1)


  page
    1) should have query param
    √ uses a dirty hack (198ms)


  1 passing (5s)
  1 failing

  1) page
       should have query param:
     CypressError: Timed out retrying after 4000ms: `cy.its()` errored because the property: `request.query.QueryName` does not exist on your subject.

`cy.its()` waited for the specified property `request.query.QueryName` to exist, but it never did.

If you do not expect the property `request.query.QueryName` to exist, then add an assertion such as:

`cy.wrap({ foo: 'bar' }).its('quux').should('not.exist')`

https://on.cypress.io/its
      at <unknown> (http://localhost:3181/__cypress/runner/cypress_runner.js:139409:80)
      at Object.subjectFn (http://localhost:3181/__cypress/runner/cypress_runner.js:154816:16)
      at $Cy.verifyUpcomingAssertions (http://localhost:3181/__cypress/runner/cypress_runner.js:134220:31)
      at onRetry (http://localhost:3181/__cypress/runner/cypress_runner.js:154808:15)
      at tryCatcher (http://localhost:3181/__cypress/runner/cypress_runner.js:11327:23)
      at Promise.attempt.Promise.try (http://localhost:3181/__cypress/runner/cypress_runner.js:8601:29)
      at whenStable (http://localhost:3181/__cypress/runner/cypress_runner.js:151463:65)
      at <unknown> (http://localhost:3181/__cypress/runner/cypress_runner.js:150871:14)
      at tryCatcher (http://localhost:3181/__cypress/runner/cypress_runner.js:11327:23)
      at Promise._settlePromiseFromHandler (http://localhost:3181/__cypress/runner/cypress_runner.js:9262:31)
      at Promise._settlePromise (http://localhost:3181/__cypress/runner/cypress_runner.js:9319:18)
      at Promise._settlePromise0 (http://localhost:3181/__cypress/runner/cypress_runner.js:9364:10)
      at Promise._settlePromises (http://localhost:3181/__cypress/runner/cypress_runner.js:9444:18)
      at Promise._fulfill (http://localhost:3181/__cypress/runner/cypress_runner.js:9388:18)
      at <unknown> (http://localhost:3181/__cypress/runner/cypress_runner.js:11002:46)
  From Your Spec Code:
      at Context.eval (webpack:///./cypress/e2e/spec.cy.js:7:24)




  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        2                                                                                │
  │ Passing:      1                                                                                │
  │ Failing:      1                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  1                                                                                │
  │ Video:        true                                                                             │
  │ Duration:     4 seconds                                                                        │
  │ Spec Ran:     spec.cy.js                                                                       │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


  (Screenshots)

  -  E:\code\cypress-intercept-query-empty\cypress\screenshots\spec.cy.js\page      (1280x720)
     -- should have query param (failed).png


  (Video)

  -  Started processing:  Compressing to 32 CRF
  -  Finished processing: E:\code\cypress-intercept-query-empty\cypress\videos\     (1 second)
                          spec.cy.js.mp4


====================================================================================================

  (Run Finished)


       Spec                                              Tests  Passing  Failing  Pending  Skipped  
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ ✖  spec.cy.js                               00:04        2        1        1        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    ✖  1 of 1 failed (100%)                     00:04        2        1        1        -        -

Other

No response

[mike-plummer]

Hi @WORMSS , thanks for letting us know about this! I verified the behavior you described (thanks so much for the simple reproduction!) and, after looking into it a bit, the query param is available but just not where you're wanting to use it. If you write a callback on the intercept then you can access request.query, but it's lost once yielded and not available later in your aliased use case. I'm working on PR that I believe will fix this, feel free to take a look if you're curious

[cypress-bot]

The code for this is done in cypress-io/cypress#25135, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[WORMSS]

@mike-plummer Thanks for the update. Funny how it's just a simple 'query' added to an array to fix it.

[mirobo]

@mike-plummer I know I'm coming late to the party :D. I wanted to use the 'query' property already in Cypress 9.7.0 and it didn't work back then as well. Thanks for the fix!

So until then I "serialized" it by myself with this function:

export function urlSearchParamsToObject(url: string) { // <-- url comes from interception.request.url
  const searchParams = new URL(url).searchParams;
  const obj = {} as Record<string, string>;
  searchParams.forEach((value, key) => {
    obj[`${key}`] = value;
  });
  return obj;
}

URLSearchParams only returns strings so I thought it's better to just create an object with just strings.

The Cypress "query" object returns values of type string|number. I tried to follow SERIALIZABLE_REQ_PROPS but I haven't found any method that serializes that property. Then I found createQueryObject here:

cypress/packages/driver/src/cy/net-stubbing/events/before-request.ts

Line 84 in 3817e50

const createQueryObject = () => {

And I wonder where that conversion to the type "string|number" happens. If it happens with JSON.stringify on URLSearchParams there shouldn't be any numbers at all?

For full context here's my custom command to verify requests off of an interception:

Cypress.Commands.add(
  'verifyRequest',
  { prevSubject: false },
  (
    interception: { request: CyHttpMessages.IncomingRequest },
    expectedBody?: Record<string, any>,
    expectedSearchParams?: Record<string, string>,
    mode: 'partial' | 'strict' = 'partial'
  ) => {
    if (expectedBody) {
      // if body is not present, cypress returns an empty string and
      // assertions on undefined, null or empty strings don't work here
      const assertableRequestBody = interception.request.body || {};
      if (mode === 'strict') {
        expect(assertableRequestBody).to.eql(expectedBody);
      } else {
        expect(assertableRequestBody).to.containSubset(expectedBody);
      }
    }
    if (expectedSearchParams) {
      // assertions on undefined, null or empty strings don't work here
      const assertableRequestQuery = urlSearchParamsToObject(interception.request.url);
      if (mode === 'strict') {
        expect(assertableRequestQuery).to.eql(expectedSearchParams);
      } else {
        expect(assertableRequestQuery).to.containSubset(expectedSearchParams);
      }
    }
  }
);

[nagash77]

Hi @mirobo , issues in the github repo are reserved for bugs and feature requests. We recommend questions relating to how to use Cypress be asked in our community chat. Also try searching our existing GitHub issues, reading through our documentation, or searching Stack Overflow for relevant answers.

[cypress-bot]

Released in 12.2.0.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v12.2.0, please open a new issue.