test: Extend happy path e2e test for registered customer

packages/commercetools/theme/pages/Checkout/ThankYou.vue

@@ -12,7 +12,7 @@
       <template #description>
         <div class="banner__order-number">
           <span>{{ $t('Order No.') }}</span>
-          <strong>{{ order.number }}</strong>
+          <strong v-e2e="'order-number'">{{ order.number }}</strong>
         </div>
       </template>
     </SfCallToAction>

packages/commercetools/theme/tests/e2e/integration/e2e-place-order.spec.ts

@@ -64,5 +64,9 @@ context('Order placement', () => {
     page.checkout.payment.terms.click();
     page.checkout.payment.makeAnOrderButton.click();
     page.checkout.thankyou.heading.should('be.visible');
+    page.checkout.thankyou.orderNumber.then(($order) => {
+      page.myAccount.orderHistory.visit();
+      page.myAccount.orderHistory.orderNumber.should('have.text', $order.text().substring(1));
+    });
   });
 });

packages/commercetools/theme/tests/e2e/pages/checkout.ts

@@ -186,6 +186,10 @@ class ThankYou {
   get heading(): Cypress.Chainable {
     return el('thank-you-banner', 'h2');
   }
+
+  get orderNumber(): Cypress.Chainable {
+    return el('order-number');
+  }
 }
 
 export {

packages/commercetools/theme/tests/e2e/pages/factory.ts

@@ -2,7 +2,7 @@ import { Billing, Payment, Shipping, ThankYou } from './checkout';
 import Cart from './components/cart-sidebar';
 import LoginModal from './components/login-modal';
 import Home from './home';
-import { Sidebar } from './my-account';
+import { OrderHistory, Sidebar } from './my-account';
 import { Product } from './product';
 import { Category } from './category';
 
@@ -29,7 +29,8 @@ const page = {
 
   get myAccount() {
     return {
-      sidebar: new Sidebar()
+      sidebar: new Sidebar(),
+      orderHistory: new OrderHistory()
     };
   },
 

packages/commercetools/theme/tests/e2e/pages/my-account.ts

@@ -1,11 +1,25 @@
-import { contains } from './utils/element';
+import Base from './base';
+import { contains, el } from './utils/element';
 
 class Sidebar {
   get heading(): Cypress.Chainable {
     return contains('my-account-content-pages', 'My Account');
   }
 }
 
+class OrderHistory extends Base {
+
+  get path(): string {
+    return '/my-account/order-history';
+  }
+
+  get orderNumber(): Cypress.Chainable {
+    return el('order-number');
+  }
+
+}
+
 export {
-  Sidebar
+  Sidebar,
+  OrderHistory
 };

packages/core/nuxt-theme-module/theme/pages/MyAccount/OrderHistory.vue

@@ -67,7 +67,7 @@
             </SfTableHeader>
           </SfTableHeading>
           <SfTableRow v-for="order in orders" :key="orderGetters.getId(order)">
-            <SfTableData>{{ orderGetters.getId(order) }}</SfTableData>
+            <SfTableData v-e2e="'order-number'">{{ orderGetters.getId(order) }}</SfTableData>
             <SfTableData>{{ orderGetters.getDate(order) }}</SfTableData>
             <SfTableData>{{ $n(orderGetters.getPrice(order), 'currency') }}</SfTableData>
             <SfTableData>