From 21d73a4bd275e4e33affb36e1cb83239e72e288b Mon Sep 17 00:00:00 2001 From: Christopher Date: Wed, 24 Apr 2024 13:56:39 +0100 Subject: [PATCH 1/3] Add test for OMIS order page --- .../views/_includes/messages/order-paid.njk | 4 +- .../views/_includes/meta-lists/invoice.njk | 3 +- src/app/views/_includes/meta-lists/quote.njk | 3 +- .../views/_includes/payment-instructions.njk | 6 +- src/app/views/_layouts/omis-base.njk | 2 +- src/app/views/_macros/entity/meta-list.njk | 2 +- src/app/views/order-summary.njk | 20 ++--- test/end-to-end/cypress/order-page-spec.cy.js | 81 +++++++++++++++++++ test/end-to-end/cypress/quote-spec.cy.js | 11 --- 9 files changed, 102 insertions(+), 30 deletions(-) create mode 100644 test/end-to-end/cypress/order-page-spec.cy.js delete mode 100644 test/end-to-end/cypress/quote-spec.cy.js diff --git a/src/app/views/_includes/messages/order-paid.njk b/src/app/views/_includes/messages/order-paid.njk index 881e32d..af1d88f 100644 --- a/src/app/views/_includes/messages/order-paid.njk +++ b/src/app/views/_includes/messages/order-paid.njk @@ -1,5 +1,5 @@ {% call Message({ type: 'info', element: 'div' }) %} -

Completed work for your order will be sent directly to {{ order.contact_email or 'you by email' }}.

+

Completed work for your order will be sent directly to {{ order.contact_email or 'you by email' }}.

-

If there are any problems, get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk.

+

If there are any problems, get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk.

{% endcall %} diff --git a/src/app/views/_includes/meta-lists/invoice.njk b/src/app/views/_includes/meta-lists/invoice.njk index 02d0a63..4ee249d 100644 --- a/src/app/views/_includes/meta-lists/invoice.njk +++ b/src/app/views/_includes/meta-lists/invoice.njk @@ -3,5 +3,6 @@ { label: 'Invoice number', value: invoice.invoice_number }, { label: 'Created on', value: invoice.created_on, type: 'datetime' }, { label: 'Paid on', value: order.paid_on, type: 'date' } - ] + ], + dataTest: "invoice" }) }} diff --git a/src/app/views/_includes/meta-lists/quote.njk b/src/app/views/_includes/meta-lists/quote.njk index 4ada346..6cc4db4 100644 --- a/src/app/views/_includes/meta-lists/quote.njk +++ b/src/app/views/_includes/meta-lists/quote.njk @@ -10,5 +10,6 @@ { label: expiryLabel, value: expiryValue if not quote.accepted_on }, { label: 'You accepted it on', value: quote.accepted_on, type: 'datetime' }, { label: 'Purchase order (PO) number', value: order.po_number } - ] + ], + dataTest: 'quote' }) }} diff --git a/src/app/views/_includes/payment-instructions.njk b/src/app/views/_includes/payment-instructions.njk index 70673cf..12df459 100644 --- a/src/app/views/_includes/payment-instructions.njk +++ b/src/app/views/_includes/payment-instructions.njk @@ -1,11 +1,11 @@ -

+

You will need to pay - the invoice + the invoice by {{ invoice.payment_due_date | formatDate }} ({{ invoice.payment_due_date | fromNow(invoice.overdue) }}{{ ' overdue' if invoice.overdue }}).

- + View payment options

diff --git a/src/app/views/_layouts/omis-base.njk b/src/app/views/_layouts/omis-base.njk index 2348be4..153560d 100644 --- a/src/app/views/_layouts/omis-base.njk +++ b/src/app/views/_layouts/omis-base.njk @@ -49,7 +49,7 @@ {% endif %} {% if subHeading %} -

{{ subHeading }}

+

{{ subHeading }}

{% endif %} {% endif %} diff --git a/src/app/views/_macros/entity/meta-list.njk b/src/app/views/_macros/entity/meta-list.njk index 3333603..be72c1d 100644 --- a/src/app/views/_macros/entity/meta-list.njk +++ b/src/app/views/_macros/entity/meta-list.njk @@ -10,7 +10,7 @@ {% set modifier = props.modifier | concat('') | reverse | join(' c-meta-list--') if props.modifier %} {% if props.items | length %} -
+
{% for metaItem in props.items %} {{ MetaItem(metaItem | assign({ highlightTerm: props.highlightTerm, modifier: metaItem.modifier or props.itemModifier })) }} {% endfor %} diff --git a/src/app/views/order-summary.njk b/src/app/views/order-summary.njk index 98fd3be..35357ca 100644 --- a/src/app/views/order-summary.njk +++ b/src/app/views/order-summary.njk @@ -13,38 +13,38 @@ {% include '_includes/messages/order-paid.njk' %} {% endif %} -

Your actions

+

Your actions

{% if not quote.accepted_on and not (quote.expired or quote.cancelled_on) %} -

Please review and accept your quote so that we can start delivering the work.

+

Please review and accept your quote so that we can start delivering the work.

- + Review your quote

{% elif order.status === 'quote_accepted' %} -

You must pay for your order to receive the work.

+

You must pay for your order to receive the work.

{% include '_includes/payment-instructions.njk' %} {% else %} -

You have no actions for this order.

+

You have no actions for this order.

{% endif %} {% if invoice %} -

Your invoice

+

Your invoice

{% include '_includes/meta-lists/invoice.njk' %} @@ -54,14 +54,14 @@ {% endif %} {% endif %} -

Your quote

+

Your quote

{% include '_includes/meta-lists/quote.njk' %} {% if quote.accepted_on or quote.expired or quote.cancelled_on %}
  • - + View your {{ 'accepted' if quote.accepted_on }} quote
    • diff --git a/test/end-to-end/cypress/order-page-spec.cy.js b/test/end-to-end/cypress/order-page-spec.cy.js new file mode 100644 index 0000000..9847e79 --- /dev/null +++ b/test/end-to-end/cypress/order-page-spec.cy.js @@ -0,0 +1,81 @@ +const { addMonths, format } = require("date-fns"); +const { formats } = require("../../../config"); + +describe("order page spec", () => { + it("when visiting an order where the quote is awaiting acceptance", () => { + cy.visit( + "http://localhost:4000/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA" + ); + cy.log('should display correct headings') + cy.get('h1').should("have.text", "Your order"); + cy.get('[data-test="subheading"]').should("have.text", "Order reference WHY589/23 in Canada") + + cy.log('should display Review your quote text and button') + cy.get('[data-test="actions-heading"]').should('have.text', 'Your actions') + cy.get('[data-test="accept-quote-text"]').should('have.text', 'Please review and accept your quote so that we can start delivering the work.') + cy.get('[data-test="review-your-quote-button"]') + .should("contain", "Review your quote") + .and('have.attr', 'href', '/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA/quote'); + + cy.log('should display Your quote text') + cy.get('[data-test="your-quote-heading"]').should('have.text', 'Your quote') + cy.get('[data-test="metalist-quote"]').should('contain', 'We sent it on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'It will expire on').and('contain', `${format(addMonths(new Date(), 1), formats.dateLong)} (in a month)`) + }); + it("when visiting an order where the quote is accepted", () => { + cy.visit( + "http://localhost:4000/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ" + ); + cy.log('should display correct headings') + cy.get('h1').should("have.text", "Your order"); + cy.get('[data-test="subheading"]').should("have.text", "Order reference RYM547/24 in Canada") + + cy.log('should display invoice text and button') + cy.get('[data-test="actions-heading"]').should('have.text', 'Your actions') + cy.get('[data-test="must-pay-text"]').should('have.text', 'You must pay for your order to receive the work.') + cy.get('[data-test="pay-invoice-text"]').should('have.text', `\n You will need to pay\n the invoice\n by ${format(addMonths(new Date(), 1), formats.dateLong)} (in a month).\n`) + cy.get('[data-test="invoice-link"]').should('have.text', 'the invoice').and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/invoice') + cy.get('[data-test="payment-options-button"]') + .should("contain", "View payment options") + .and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/payment') + cy.get('[data-test="accept-quote-text"]').should('not.exist') + cy.get('[data-test="review-your-quote-button"]').should("not.exist") + + cy.log('should display Your invoice text') + cy.get('[data-test="invoice-heading"]').should('have.text', 'Your invoice') + cy.get('[data-test="metalist-invoice"]').should('contain', 'Invoice number').and('contain', 'Created on').and('contain', format(new Date(), formats.dateLong)) + cy.get('[data-test="view-invoice-link"]').should('contain', 'View your invoice').and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/invoice') + + cy.log('should display Your quote text') + cy.get('[data-test="your-quote-heading"]').should('have.text', 'Your quote') + cy.get('[data-test="metalist-quote"]').should('contain', 'We sent it on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'You accepted it on') + cy.get('[data-test="quote-link"]').should('contain', 'View your accepted quote').and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/quote') + }); + it("when visiting an order that has been paid for", () => { + cy.visit( + "http://localhost:4000/h93Dn7DKvMLbUB5Yz2h5z7dL1mXXGUa_UiPNBkVoyKLmBE29YQ" + ); + cy.log('should display correct headings') + cy.get('h1').should("have.text", "Your order"); + cy.get('[data-test="subheading"]').should("have.text", "Order reference CJC167/23 in Canada") + + cy.log('should display completion box') + cy.get('[data-test="completed-text"]').should('have.text', 'Completed work for your order will be sent directly to you by email.') + cy.get('[data-test="problem-text"]').should('have.text', 'If there are any problems, get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk.') + cy.get('[data-test="omis-email"]').should('have.attr', 'href', 'mailto:omis.orders@digital.trade.gov.uk') + + cy.log('should display invoice text and button') + cy.get('[data-test="actions-heading"]').should('have.text', 'Your actions') + cy.get('[data-test="no-actions-text"]').should('have.text', 'You have no actions for this order.') + + cy.log('should display Your invoice text') + cy.get('[data-test="invoice-heading"]').should('have.text', 'Your invoice') + cy.get('[data-test="metalist-invoice"]').should('contain', 'Invoice number').and('contain', 'Created on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'Paid on') + cy.get('[data-test="view-invoice-link"]').should('contain', 'View your invoice').and('have.attr', 'href', '/h93Dn7DKvMLbUB5Yz2h5z7dL1mXXGUa_UiPNBkVoyKLmBE29YQ/invoice') + cy.get('[data-test="receipt-link"]').should('contain', 'View your payment receipt').and('have.attr', 'href', '/h93Dn7DKvMLbUB5Yz2h5z7dL1mXXGUa_UiPNBkVoyKLmBE29YQ/receipt') + + cy.log('should display Your quote text') + cy.get('[data-test="your-quote-heading"]').should('have.text', 'Your quote') + cy.get('[data-test="metalist-quote"]').should('contain', 'We sent it on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'You accepted it on') + cy.get('[data-test="quote-link"]').should('contain', 'View your accepted quote').and('have.attr', 'href', '/h93Dn7DKvMLbUB5Yz2h5z7dL1mXXGUa_UiPNBkVoyKLmBE29YQ/quote') + }); +}); \ No newline at end of file diff --git a/test/end-to-end/cypress/quote-spec.cy.js b/test/end-to-end/cypress/quote-spec.cy.js deleted file mode 100644 index 8c31539..0000000 --- a/test/end-to-end/cypress/quote-spec.cy.js +++ /dev/null @@ -1,11 +0,0 @@ -describe("quote spec", () => { - it("visits OMIS order page", () => { - cy.visit( - "http://localhost:4000/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA" - ); - cy.get("h1").should("exist").and("have.text", "Your order"); - cy.get('[class="button"]') - .should("exist") - .and("contain", "Review your quote"); - }); -}); From e1f1b4131c75ba46f7bb34866793daa9afdba24e Mon Sep 17 00:00:00 2001 From: Christopher Date: Thu, 25 Apr 2024 15:48:41 +0100 Subject: [PATCH 2/3] Add test for OMIS quote page --- .../_includes/messages/general-contact.njk | 2 +- src/app/views/_layouts/omis-base.njk | 2 +- src/app/views/_macros/common/reveal.njk | 2 +- src/app/views/quote.njk | 6 +- test/end-to-end/cypress/quote-page-spec.cy.js | 59 +++++++++++++++++++ 5 files changed, 65 insertions(+), 6 deletions(-) create mode 100644 test/end-to-end/cypress/quote-page-spec.cy.js diff --git a/src/app/views/_includes/messages/general-contact.njk b/src/app/views/_includes/messages/general-contact.njk index c307e20..4c80276 100644 --- a/src/app/views/_includes/messages/general-contact.njk +++ b/src/app/views/_includes/messages/general-contact.njk @@ -1,3 +1,3 @@ {% call Message({ type: 'muted' }) %} - Get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk + Get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk {% endcall %} diff --git a/src/app/views/_layouts/omis-base.njk b/src/app/views/_layouts/omis-base.njk index 153560d..8b3bf80 100644 --- a/src/app/views/_layouts/omis-base.njk +++ b/src/app/views/_layouts/omis-base.njk @@ -40,7 +40,7 @@
    {% if not hideReturnLink %}

    - View your order history + View your order history

    {% endif %} diff --git a/src/app/views/_macros/common/reveal.njk b/src/app/views/_macros/common/reveal.njk index 1f1c695..21f3245 100644 --- a/src/app/views/_macros/common/reveal.njk +++ b/src/app/views/_macros/common/reveal.njk @@ -11,7 +11,7 @@ {%- if props.summary -%}
    - {{ props.summary }} + {{ props.summary }}
    diff --git a/src/app/views/quote.njk b/src/app/views/quote.njk index 79ad91e..0c4a6c3 100644 --- a/src/app/views/quote.njk +++ b/src/app/views/quote.njk @@ -20,7 +20,7 @@ {% if quote.content %}
    -
    +
    {# Ugly indentation is so that markdown spacing is handled correctly #} {% markdown %}{{ quote.content | safe }}{% endmarkdown %} {% call Reveal({ summary: 'View full terms and conditions' }) %} @@ -50,10 +50,10 @@ error: 'Confirm that you accept the Charges and the Terms and Conditions' if invalid }) }} - + - {% call Reveal({ summary: 'There is a problem with my quote' }) %} + {% call Reveal({ summary: 'There is a problem with my quote', dataTest: 'quote-problem' }) %} {% include '_includes/messages/general-contact.njk' %} {% endcall %} {% endif %} diff --git a/test/end-to-end/cypress/quote-page-spec.cy.js b/test/end-to-end/cypress/quote-page-spec.cy.js new file mode 100644 index 0000000..ee16571 --- /dev/null +++ b/test/end-to-end/cypress/quote-page-spec.cy.js @@ -0,0 +1,59 @@ +const { addMonths, format } = require('date-fns') +const { formats } = require("../../../config"); + +describe("quote page spec", () => { + it("where the quote is awaiting acceptance", () => { + cy.visit( + "http://localhost:4000/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA/quote" + ); + cy.log('should render correct headings') + cy.get('[data-test="order-history-link"]').should('have.text', 'View your order history').and('have.attr', 'href', '/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA') + cy.get('[class="local-header__heading"]').should('have.text', 'Your quote') + cy.get('[data-test="subheading"]').should('have.text', 'Order reference WHY589/23 for Canada') + cy.get('[data-test="metalist-quote"]').should('contain', 'We sent it on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'It will expire on').and('contain', `${format(addMonths(new Date(), 1), formats.dateLong)} (in a month)`) + + cy.log('should render quote') + cy.get('[data-test="quote"]').should('contain', `Date: ${format(new Date(), formats.dateLong)}`) + .and('contain', 'Quote for the Provision of an Overseas Market Introduction Service (“OMIS”): WHY589/23 (the Quote)') + .and('contain', 'Motorleaf Global HQ of 5000 Rue Saint-Patrick, Montréal, H4E 1A8, Canada') + .and('contain', 'DBT will deliver the Services on or before the Delivery Date which shall be 7 May 2030') + .and('contain', 'The Customer Contact shall be Johnny Cakeman of Motorleaf Global HQ, 5000 Rue Saint-Patrick, Montréal, H4E 1A8, Canada and johnny@cakeman.com.') + .and('contain', `This Quote must be accepted by you by ${format(addMonths(new Date(), 1), formats.dateLong)}.`) + + cy.log('should render the quote acceptance elements') + cy.get('[data-test="field-confirm-1"]').should('contain', 'I accept the Charges and the Terms and Conditions') + cy.get('[data-test="accept-quote-button"]').should('have.text', 'Accept quote') + cy.get('[data-test="reveal-quote-problem"]').should('have.text', 'There is a problem with my quote').click() + cy.get('[class="c-message c-message--muted"]').should('contain', 'Get in touch with your DBT contact or email omis.orders@digital.trade.gov.uk') + cy.get('[data-test="omis-orders-email"]').should('have.attr', 'href', 'mailto:omis.orders@digital.trade.gov.uk') + + cy.log('should accept the quote') + cy.get('[data-test="field-confirm-1"]').click() + cy.get('[data-test="accept-quote-button"]').click() + cy.location('pathname').should('eq', '/7AGZC7uaAIV-5L34J5lnZXHvFG9J1xnbBQnieAUCn-LRJpr-QA/quote/accepted') + + }); + it("when visiting an order where the quote is accepted", () => { + cy.visit( + "http://localhost:4000/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/quote" + ); + cy.log('should render correct headings') + cy.get('[data-test="order-history-link"]').should('have.text', 'View your order history').and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ') + cy.get('[class="local-header__heading"]').should('have.text', 'Your quote') + cy.get('[data-test="subheading"]').should('have.text', 'Order reference RYM547/24 for Canada') + cy.get('[data-test="metalist-quote"]').should('contain', 'We sent it on').and('contain', format(new Date(), formats.dateLong)).and('contain', 'You accepted it on') + + cy.log('should render quote') + cy.get('[data-test="quote"]').should('contain', `Date: ${format(new Date(), formats.dateLong)}`) + .and('contain', 'Quote for the Provision of an Overseas Market Introduction Service (“OMIS”): RYM547/24 (the Quote)') + .and('contain', 'Motorleaf Global HQ of 5000 Rue Saint-Patrick, Montréal, H4E 1A8, Canada') + .and('contain', 'DBT will deliver the Services on or before the Delivery Date which shall be 7 May 2030') + .and('contain', 'The Customer Contact shall be Johnny Cakeman of Motorleaf Global HQ, 5000 Rue Saint-Patrick, Montréal, H4E 1A8, Canada and johnny@cakeman.com.') + .and('contain', `This Quote must be accepted by you by ${format(addMonths(new Date(), 1), formats.dateLong)}.`) + + cy.log('should not display the acceptance elements') + cy.get('[data-test="field-confirm-1"]').should('not.exist') + cy.get('[data-test="accept-quote-button"]').should('not.exist') + cy.get('[data-test="reveal-quote-problem"]').should('not.exist') + }) +}); \ No newline at end of file From b4308da4f916939910764f5dec3123499d89b873 Mon Sep 17 00:00:00 2001 From: Christopher Date: Fri, 26 Apr 2024 15:27:23 +0100 Subject: [PATCH 3/3] Add test for quote accepted page --- src/app/views/quote-accepted.njk | 6 +++--- .../cypress/quote-accepted-spec.cy.js | 20 +++++++++++++++++++ 2 files changed, 23 insertions(+), 3 deletions(-) create mode 100644 test/end-to-end/cypress/quote-accepted-spec.cy.js diff --git a/src/app/views/quote-accepted.njk b/src/app/views/quote-accepted.njk index 1c305f8..e7a5cc1 100644 --- a/src/app/views/quote-accepted.njk +++ b/src/app/views/quote-accepted.njk @@ -3,7 +3,7 @@ {% set hideReturnLink = true %} {% block main_content %} -
    +

    Quote accepted

    @@ -16,11 +16,11 @@

    What happens next

    -

    You will receive a confirmation email that the quote has been accepted.

    +

    You will receive a confirmation email that the quote has been accepted.

    {% include '_includes/payment-instructions.njk' %}

    - View your order history + View your order history

    {% endblock %} diff --git a/test/end-to-end/cypress/quote-accepted-spec.cy.js b/test/end-to-end/cypress/quote-accepted-spec.cy.js new file mode 100644 index 0000000..cdd49f6 --- /dev/null +++ b/test/end-to-end/cypress/quote-accepted-spec.cy.js @@ -0,0 +1,20 @@ +const { addMonths, format } = require('date-fns') +const { formats } = require("../../../config"); + +describe("quote acceptance page spec", () => { + it("when accepting a quote", () => { + cy.visit( + "http://localhost:4000/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/quote/accepted" + ); + + cy.log('should render all elements correctly') + cy.get('[data-test="confirmation-banner"]').should('contain', 'Quote accepted').and('contain', 'Your reference number is').and('contain', 'RYM547/24') + cy.get('h3').should('have.text', 'What happens next') + cy.get('[data-test="confirmation-text"]').should('have.text', 'You will receive a confirmation email that the quote has been accepted.') + cy.get('[data-test="pay-invoice-text"]').should('have.text', `\n You will need to pay\n the invoice\n by ${format(addMonths(new Date(), 1), formats.dateLong)} (in a month).\n`) + cy.get('[data-test="payment-options-button"]') + .should("contain", "View payment options") + .and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ/payment') + cy.get('[data-test="order-history-link"]').should('have.text', 'View your order history').and('have.attr', 'href', '/XXMPH3b2185a7Vpe2f3RiI5HXT0Nshrck_6xGJuRp4UAsA6vkQ') + }) +}) \ No newline at end of file