rejects a transaction request

Before continuing, make sure you have read the Transaction View Overview & Setup lesson first.

it("rejects a transaction request", () => {
    cy.visit(`/transaction/${ctx.transactionRequest!.id}`);
    cy.wait("@getTransaction");

    cy.getBySelLike("reject-request").click();
    cy.wait("@updateTransaction").its("response.statusCode").should("equal", 204);
    cy.getBySelLike("reject-request").should("not.exist");
    cy.getBySel("transaction-detail-header").should("be.visible");
    cy.visualSnapshot("Transaction Rejected");
  });

You can find out more information about the custom Cypress commands used in this test here.

First, we visit the transaction screen for the specific transaction we looked up within the beforeEach() hook at the top of the spec file. Then we wait upon the @getTransaction intercept.

cy.visit(`/transaction/${ctx.transactionRequest!.id}`);
    cy.wait("@getTransaction");

Next, we click on the "Reject Request" button and wait on the @updateTransaction intercept and confirm that this intercepts status code is 204.

cy.getBySelLike("reject-request").click()
cy.wait("@updateTransaction").its("response.statusCode").should("equal", 204)

Screenshot of Cypress App with a 'click' command highlighted in purple in the Cypress Command Log. A red button with the text 'Reject Request' is highlighted in the application under text, with a red dot indicating the exact point that was clicked, which is in the center of the button.

Screenshot of Cypress App with an 'assert' highlighted in purple in the Cypress Command Log. The assert text says 'expected 204 to equal 204'. The Dev Tools console is open showing details of the assert command.

Finally, we make sure the reject request button is no longer in the DOM and that the transaction detail header is visible.

cy.getBySelLike("reject-request").should("not.exist")
cy.getBySel("transaction-detail-header").should("be.visible")

Screenshot of Cypress App with the 'assert' highlighted in purple in the Cypress Command Log. The passing assertion text says 'expected h2 to be visible'. The application under test shows the Real World App on the Transaction Detail page where a transaction is visible.