Merge pull request #160 from Arquisoft/Acceptance-Tests

Acceptance tests

docs/08_concepts.adoc

@@ -17,10 +17,10 @@ Protocol HTTPS will be used to ensure the user's secure access, and validation c
 SOLID pods also provide a mean of security, as each user is the only owner of his/her private information stored in a decentralised way.
 
 === Technical decisions
-TBD
+An independent login was used to access the administrator page, we considered this decision a mean of improving security on that specific feature, as there will be only one administrator and we don't want to depend on external providers for performing any of its responsabilities.
 
 === Internationalization
-The project will be a multi-language application since the beginning of the design, to save expensive future costs in implementing this functionality.
+The project will be a multi-language application since the beginning of the design, to save expensive future costs in implementing this functionality. 
 
 === Notifications
 A notification system will be implemented, in which a user gets a notification that provides relevant information to keep track of the product, such as whether that product has arrived or not.

docs/13_testing.adoc

@@ -0,0 +1,150 @@
+[[section-quality-scenarios]]
+== Testing
+Different testing methods were used to check the correct functioning and implementation of the project.
+
+
+=== Unitary Tests
+
+
+
+=== Integration Tests
+
+We used Jest and Cucumber to perform integration testing in our app. Thanks to cucumber, we could design integration tests following the famous syntax "Given, When, Then". This allowed for better understandability of the code as well as easier debugging. 
+
+We divided the 8 tests in 5 different suites, who aggregate similar tests. For each on of them, these were the features tested:
+
+====
+* Add Address:
+
+Feature: Adding/Changing DedEx Address
+
+Scenario: Adding an address
+
+*    Given A loged in user
+
+*    When They change their address in their profile
+
+*    Then It appears on the shipping page
+
+====
+
+====
+* Add to Cart:
+
+Feature: Adding items to the cart
+
+Scenario: Adding one item
+
+* Given A user
+
+* When They add an item to the cart and navigate to the cart
+
+* Then They can see the item
+
+
+Scenario: Adding an item from product details view
+
+* Given A user
+
+* When They add an item to the cart from the details view of the product and navigate to the cart
+
+* Then They can see the item
+====
+
+====
+* Buy item:
+
+Feature: Buying products
+
+Scenario: Buying a product
+
+*  Given A user with an item in his cart
+
+*  When They buy it
+
+*  Then The order appears in their profile
+
+====
+
+====
+* Product Visualization:
+
+Feature: Visualizing products
+
+Scenario: Main Products view
+
+*  Given An user
+
+*  When They enter the application
+
+*  Then Several Prodcut cards must be shown
+
+
+Scenario: Product detail view
+
+*  Given An user
+
+*  When They enter the application and click on a product card
+
+*  Then The details view of the selected product must be shown
+
+====
+
+====
+* SOLID Login:
+
+Feature: Registering or logging in a new user
+
+Scenario: The user is not registered in the site
+
+*    Given An unregistered user
+
+*    When They press the profile button and log in with their preferred SOLID provider
+
+*    Then Their name should be shown
+
+
+Scenario: The user is registered in the site
+
+*    Given A registered user
+
+*    When They press the profile button and log in with their preferred SOLID provider
+
+*    Then Their name and orders, if any, should be shown
+
+====
+
+The result of running these test is as follows: 
+
+image::images/acceptanceResults.png[]
+
+
+=== Load Tests
+
+Gatling tool was used to perform load tests to the application.
+Using its recorder functionality we were able to capture a fixed number of requests and reproduce their functionality for every user that was simulated by the program.
+
+Those requests included the use of filters, adding products to the cart, modifying their quantities and perform checkout functionality. 
+
+The recorder tool acts as a man-in-the-middle to capture the traffic and requests made, we had to modify the proxy configuration in our browsers for the tool to do the before-mentioned actions properly, losing internet connection meanwhile. 
+
+This internet loss made it impossible for us to load test the SOLID login and, as a consequence, the order creation. 
+
+An Open Model for user injection was the one used because you control the arrival rate of users, and the concurrent number of users in our web is not capped. We used this injection setup.
+
+image::images/gatlingSetUp.png[]
+
+An approximate number of 18k requests were made during the test in which 10% of those had a response time between 800ms and 1200ms, and just 1% had a response time above the latter. 
+
+image::images/gatlingChart.png[]
+
+During the test there was a peak of 196 concurrent users.
+
+image::images/gatlingActiveUsers.png[]
+
+Observing the percentile response time chart generated we can know where in the execution of the recording the requests consume more time and its different distributions. The requests that consume more time in this test would be filter usage, and quantity modification in the shopping cart.
+
+image::images/gatlingPercentiles.png[]
+
+
+

webapp/e2e/features/Product_Visualization.feature

@@ -0,0 +1,11 @@
+Feature: Visualizing products
+
+Scenario: Main Products view
+  Given An user
+  When They enter the application
+  Then Several Prodcut cards must be shown
+
+Scenario: Product detail view
+  Given An user
+  When They enter the application and click on a product card
+  Then The details view of the selected product must be shown

webapp/e2e/features/SOLID-login.feature

@@ -0,0 +1,11 @@
+Feature: Registering or logging in a new user
+
+Scenario: The user is not registered in the site
+    Given An unregistered user
+    When They press the profile button and log in with their preferred SOLID provider
+    Then Their name should be shown
+
+Scenario: The user is registered in the site
+    Given A registered user
+    When They press the profile button and log in with their preferred SOLID provider
+    Then Their name and orders, if any, should be shown

webapp/e2e/features/add-address.feature

@@ -0,0 +1,6 @@
+Feature: Adding/Changing DedEx Address
+
+Scenario: Adding an address
+    Given A loged in user
+    When They change their address in their profile
+    Then It appears on the shipping page

webapp/e2e/features/add-to-cart.feature

@@ -0,0 +1,11 @@
+Feature: Adding items to the cart
+
+Scenario: Adding one item
+    Given A user
+    When They add an item to the cart and navigate to the cart
+    Then They can see the item
+
+Scenario: Adding an item from product details view
+    Given A user
+    When They add an item to the cart from the details view of the product and navigate to the cart
+    Then They can see the item

webapp/e2e/features/buy-item.feature

@@ -0,0 +1,6 @@
+Feature: Buying products
+
+Scenario: Buying a product
+  Given A user with an item in his cart
+  When They buy it
+  Then The order appears in their profile

webapp/e2e/refactor.ts

@@ -0,0 +1,87 @@
+import puppeteer from "puppeteer";
+
+let page: puppeteer.Page;
+let browser: puppeteer.Browser;
+
+export async function login() {
+    jest.setTimeout(60000);
+
+    let u: string;
+    let p: string;
+    u = "dedeen1btests";
+    p = "DeDe_En1B_Tests";
+
+    await page.setCacheEnabled(false);
+    await new Promise(r => setTimeout(r, 1000));
+    await expect(page).toClick("#loginButton");
+    await new Promise(r => setTimeout(r, 10000));
+    await expect(page).toFillForm('form[name="cognitoSignInForm"]', {
+        username: u,
+        password: p,
+    });
+    await expect(page).toClick('input[name="signInSubmitButton"]');
+    await new Promise(r => setTimeout(r, 2000));
+    await expect(page).toClick("button.allow-button");
+    await new Promise(r => setTimeout(r, 5000));
+}
+
+export async function addToCart(url: string) {
+    await page.goto(url);
+    await new Promise(r => setTimeout(r, 3000));
+    await expect(page).toClick('#addToCartButton');
+    await new Promise(r => setTimeout(r, 2000));
+}
+
+export async function setUp(url: string) {
+    jest.setTimeout(60000);
+
+
+    browser = process.env.GITHUB_ACTIONS
+        ? await puppeteer.launch()
+        : await puppeteer.launch({ headless: true });
+    page = await browser.newPage();
+
+    await page
+        .goto(url, {
+            waitUntil: "networkidle0",
+        })
+        .catch((error) => { console.log(error); });
+    return page;
+}
+
+export async function loginAndAddToCart(url: string) {
+    await page.setCacheEnabled(false);
+
+    //Login
+    await login();
+
+    //Add to cart
+    await addToCart(url);
+}
+
+export async function getPage() {
+    return page;
+}
+
+export async function getBrowser() {
+    return page;
+}
+
+export function close() {
+    browser.close();
+}
+export async function quickLogin() {
+    let u: string;
+    let p: string;
+    u = "dedeen1btests";
+    p = "DeDe_En1B_Tests";
+
+    await expect(page).toFillForm('form[name="cognitoSignInForm"]', {
+        username: u,
+        password: p,
+    });
+    await expect(page).toClick('input[name="signInSubmitButton"]');
+    await new Promise(r => setTimeout(r, 2000));
+    await expect(page).toClick("button.allow-button");
+    await new Promise(r => setTimeout(r, 5000));
+}

webapp/e2e/steps/Product_Visualization.steps.ts

@@ -0,0 +1,59 @@
+import { defineFeature, loadFeature } from 'jest-cucumber';
+import puppeteer from "puppeteer";
+import { getPage, setUp, close } from '../refactor';
+
+const feature = loadFeature('./e2e/features/Product_Visualization.feature');
+
+let page: puppeteer.Page;
+let browser: puppeteer.Browser;
+
+defineFeature(feature, test => {
+
+    jest.setTimeout(30000);
+
+    beforeAll(async () => {
+        await setUp("https://www.dedeen1b.tk/");
+        page = await getPage();
+    });
+
+    test('Main Products view', ({ given, when, then }) => {
+
+        given('An user', () => {
+            console.log("Test starting...");
+        });
+
+        when('They enter the application', async () => {
+            await new Promise(r => setTimeout(r, 2000));
+        });
+
+        then('Several Prodcut cards must be shown', async () => {
+            await expect(page).toMatch('Nissan 300ZX');
+            await expect(page).toMatch('Toyota 2000GT');
+            await expect(page).toMatch('Plymouth Barracuda');
+        });
+    });
+
+    test('Product detail view', ({ given, when, then }) => {
+
+        given('An user', () => {
+            console.log("Test starting...");
+        });
+
+        when('They enter the application and click on a product card', async () => {
+            await new Promise(r => setTimeout(r, 2000));
+            await expect(page).toClick("div.product-card");
+        });
+
+        then('The details view of the selected product must be shown', async () => {
+            await new Promise(r => setTimeout(r, 2000));
+            await expect(page).toMatch('Nissan 300ZX');
+            await expect(page).toMatch('Widebody. Banana Split Yellow. A beast.');
+        });
+    })
+
+    afterAll(async () => {
+        close();
+    })
+
+});
+