PSPAYPAL-815 add e2e tests

services.yaml

@@ -55,3 +55,7 @@ services:
   OxidSolutionCatalysts\PayPal\Service\SCAValidatorInterface:
     class:  OxidSolutionCatalysts\PayPal\Service\SCAValidator
     public: true
+
+  OxidSolutionCatalysts\PayPal\Twig\TestIdExtension:
+    tags:
+      - { name: twig.extension }

src/Twig/TestIdExtension.php

@@ -0,0 +1,21 @@
+<?php
+
+namespace OxidSolutionCatalysts\PayPal\Twig;
+
+use Twig\Extension\AbstractExtension;
+use Twig\TwigFunction;
+
+class TestIdExtension extends AbstractExtension
+{
+    public function getFunctions()
+    {
+        return [
+            new TwigFunction('render_test_id', [$this, 'renderTestId']),
+        ];
+    }
+
+    public function renderTestId(string $testId): string
+    {
+        return sprintf(' data-test-id="%s"', htmlspecialchars($testId, ENT_QUOTES));
+    }
+}

tests/Codeception/Acceptance/GooglePayCheckoutCest.php

@@ -0,0 +1,35 @@
+<?php
+
+/**
+ * Copyright © OXID eSales AG. All rights reserved.
+ * See LICENSE file for license details.
+ */
+
+declare(strict_types=1);
+
+namespace OxidSolutionCatalysts\PayPal\Tests\Codeception\Acceptance;
+
+use OxidSolutionCatalysts\PayPal\Tests\Codeception\AcceptanceTester;
+use OxidSolutionCatalysts\PayPal\Tests\Codeception\Page\VirtualPage;
+
+/**
+ * @group osc_paypal
+ * @group osc_paypal_checkout
+ * @group osc_paypal_checkout_acdc
+ * @group osc_paypal_remote_login
+ */
+final class GooglePayCheckoutCest extends BaseCest
+{
+    public function checkoutWithGooglePay(AcceptanceTester $I): void
+    {
+        $I->wantToTest('checkout with google pay');
+
+        $I->resizeWindow(1024, 576);
+        $virtualPage = new VirtualPage($I);
+        $virtualPage->openShopAndLogin();
+
+        $basketPage = $virtualPage->addProductToBasket();
+
+        $basketPage->checkout();
+    }
+}

tests/Codeception/_data/fixtures.php

@@ -27,19 +27,19 @@
     ],
     // This product is available in ce|pe|ee demodata
     'product' => [
-        'oxid' => 'dc5ffdf380e15674b56dd562a7cb6aec',
-        'oxtitle' => 'Kuyichi Ledergürtel JEVER',
-        'oxtitle_1' => 'Kuyichi leather belt JEVER',
-        'shortdesc_1' => 'Leather belt, unisex',
-        'title' => 'Kuyichi leather belt JEVER',
+        'oxid' => '22e135eb03a3aa69198ae30762ee785c',
+        'oxtitle' => 'Ocean Eyes',
+        'oxtitle_1' => 'Ocean Eyes',
+        'shortdesc_1' => 'Polarisierte Sport Sonnenbrille - Unisex',
+        'title' => 'Ocean Eyes',
         'amount' => 4,
-        'bruttoprice_cart' => 119.6,
-        'bruttoprice_single' => 29.9,
-        'nettoprice_single' => 25.13,
-        'nettoprice_cart' => 100.52,
-        'total_price' => '119,6 €',
-        'one_item_total_with_shipping' => '33.80',
-        'oxartnum' => '3503'
+        'bruttoprice_cart' => 426,
+        'bruttoprice_single' => 106.50,
+        'nettoprice_single' => 89.50,
+        'nettoprice_cart' => 358,
+        'total_price' => '426 €',
+        'one_item_total_with_shipping' => '106.50',
+        'oxartnum' => '999a4'
     ],
     'parent' => [
         'id' => '531b537118f5f4d7a427cdb825440922',

tests/Codeception/_support/Page/BasketPage.php

@@ -0,0 +1,22 @@
+<?php
+
+namespace OxidSolutionCatalysts\PayPal\Tests\Codeception\Page;
+
+use OxidEsales\Codeception\Page\Page;
+
+class BasketPage extends Page
+{
+    private const SUBMIT_BUTTON_SELECTOR = '[data-test-id="checkout-button"]';
+    public function checkout()
+    {
+        $this->user->scrollTo(self::SUBMIT_BUTTON_SELECTOR);
+        $this->user->click(self::SUBMIT_BUTTON_SELECTOR);
+        $this->user->see('#user_form');
+    }
+
+    public function isSubmitButtonVisible(): void
+    {
+        $this->user->scrollTo(self::SUBMIT_BUTTON_SELECTOR);
+        $this->user->waitForElement(self::SUBMIT_BUTTON_SELECTOR);
+    }
+}

tests/Codeception/_support/Page/VirtualPage.php

@@ -0,0 +1,41 @@
+<?php
+
+/**
+ * Copyright © OXID eSales AG. All rights reserved.
+ * See LICENSE file for license details.
+ */
+
+declare(strict_types=1);
+
+namespace OxidSolutionCatalysts\PayPal\Tests\Codeception\Page;
+
+use Codeception\Util\Fixtures;
+use OxidEsales\Codeception\Module\Translation\Translator;
+use OxidEsales\Codeception\Page\Home;
+use OxidEsales\Codeception\Page\Page;
+use OxidEsales\Codeception\Step\Basket;
+
+class VirtualPage extends Page
+{
+    public function addProductToBasket(): BasketPage
+    {
+        $product = Fixtures::get('product');
+        $basketStep = new Basket($this->user);
+
+        $basketStep->addProductToBasketAndOpenBasket($product['oxid'], $product['amount'], 'basket');
+
+        $basketPage = new BasketPage($this->user);
+        $basketPage->isSubmitButtonVisible();
+
+        return $basketPage;
+    }
+
+    public function openShopAndLogin(): Home
+    {
+        $homePage = $this->user->openShop()->loginUser(Fixtures::get('userName'), Fixtures::get('userPassword'));
+
+        $this->user->waitForText(Translator::translate('INFORMATION'));
+
+        return $homePage;
+    }
+}

tests/CypressTests/cypress.config.js

@@ -10,4 +10,5 @@ module.exports = defineConfig({
     },
   },
   experimentalStudio: true,
+  chromeWebSecurity: false // by default and for security reasons, browsers restrict access to windows with a different origin. so in order to interact with these we disable this restriction
 });

tests/CypressTests/cypress/command/CommandManager.ts

@@ -0,0 +1,10 @@
+import {PopUpCommand} from "./PopUpCommand";
+import {PopUpCaptureCommand} from "./PopUpCaptureCommand";
+
+export class CommandManager {
+    popupReference: any = {}
+    init() {
+        PopUpCaptureCommand.init(this.popupReference);
+        PopUpCommand.init(this.popupReference);
+    }
+}

tests/CypressTests/cypress/command/PopUpCaptureCommand.ts

@@ -0,0 +1,45 @@
+export class PopUpCaptureCommand {
+    static init(popupReference: any) {
+        Cypress.Commands.add('capturePopup', () => {
+            const originalWindowOpen = window.open;
+
+// Override the window.open method
+            window.open = function(url, target, features) {
+                console.log('window.open called with URL:', url);
+                console.log('Target:', target);
+                console.log('Features:', features);
+
+                return originalWindowOpen.apply(this, arguments); // Call the original window.open
+            };
+            cy.window().then((win) => {
+                //cy.stub(win, 'open').as('popupStub');
+
+
+                // Stub `window.open` to simulate the PayPal popup
+                /*cy.window().then((win) => {
+                    cy.stub(win, 'open').callsFake((url) => {
+                        expect(url).to.include('paypal.com'); // Assert the correct URL is used
+                        console.log(url)
+                        return {
+                            document: {
+                                write: Cypress.sinon.stub(), // Stub methods you expect to be called on the popup
+                            },
+                            close: Cypress.sinon.stub(),
+                        };
+                    }).as('popupStub');
+                });*/
+
+
+
+                const open = win.open
+                cy
+                    .stub(win, 'open')
+                    .callsFake((...params) => {
+                        // Capture the reference to the popup
+                        popupReference.popup = open(...params)
+                        return popupReference.popup
+                    })
+            })
+        })
+    }
+}

tests/CypressTests/cypress/command/PopUpCommand.ts

@@ -0,0 +1,8 @@
+export class PopUpCommand {
+    static init(popupReference: any) {
+        Cypress.Commands.add("popup", () => {
+            const popup = Cypress.$(popupReference.popup.document)
+            return cy.wrap(popup.contents().find('body'))
+        })
+    }
+}

tests/CypressTests/cypress/cypress.d.ts

@@ -0,0 +1,15 @@
+declare namespace Cypress {
+    interface Chainable {
+        /**
+         * Custom command to interact with popups
+         * @example cy.popup()
+         */
+        popup(): Chainable<JQuery<HTMLElement>>;
+
+        /**
+         * Custom command to capture popup
+         * @example cy.capturePopup()
+         */
+        capturePopup(): Chainable<JQuery<HTMLElement>>;
+    }
+}

tests/CypressTests/cypress/e2e/checkout-with-register-and-invoice.cy.js

@@ -5,7 +5,7 @@ describe('template spec', () => {
   it('passes', () => {
     cy.visit(ShopDomainService.getShopUrl())
 
-    PageFactoryService.getStartPage(cy).putFirstNewItemInBasket()
+    PageFactoryService.getStartPage(cy).putFirstNewItemInBasketAndGoToBasket()
 
     PageFactoryService.getUserPage(cy).clickRegisterButton()
 

tests/CypressTests/cypress/e2e/checkout-with-register-and-paypal-express.cy.js

@@ -0,0 +1,18 @@
+import { PageFactoryService } from "../service/PageFactoryService";
+import { ShopDomainService } from "../service/ShopDomainService";
+import {CommandManager} from "../command/CommandManager";
+
+describe('template spec', () => {
+  it('passes', () => {
+    cy.log(JSON.stringify(Cypress.config(), null, 2));
+    const commandManager = new CommandManager();
+    commandManager.init();
+    cy.capturePopup()
+
+    cy.visit(ShopDomainService.getShopUrl())
+
+    PageFactoryService.getStartPage(cy).putFirstNewItemInBasket()
+
+    PageFactoryService.getBasketPage(cy).clickExpressButton()
+  })
+})