Merge pull request #144 from Arquisoft/pruebas_cucumber

Pruebas cucumber

webapp/e2e/features/initial.feature

@@ -0,0 +1,33 @@
+# DSL de Gherkin con los escenarios de prueba
+
+Feature: Acceso inicial a la aplicación
+
+Scenario: El usuario accede a la página de bienvenida
+  Given Un acceso a la app por un usuario
+  When Tras hacer click en el botón Inicio
+  Then El usuario es redirigido a la página de bienvenida
+
+Scenario: El usuario accede a la página sobre nosotros
+  Given Un acceso a la app por un usuario
+  When Tras hacer click en el botón Sobre Nosotros
+  Then El usuario es redirigido a la página sobre nosotros
+
+Scenario: El usuario accede a la página de inicio de sesión desde Comenzar
+  Given Un acceso a la página de bienvenida de la app por un usuario
+  When Tras hacer click en el botón Comenzar
+  Then El usuario es redirigido a la página de inicio de sesión
+
+Scenario: El usuario accede a la página de inicio de sesión
+  Given Un acceso a la app por un usuario
+  When Tras hacer click en el botón Profile
+  Then El usuario es redirigido a la página de inicio de sesión
+
+Scenario: El usuario accede a la página de Solid
+  Given Un acceso a la página de bienvenida de la app por un usuario
+  When Tras hacer click en el icono de Solid
+  Then El usuario es redirigido a la página de Solid
+
+Scenario: El usuario accede a la página de documentación
+  Given Un acceso a la app por un usuario
+  When Tras hacer click en el botón Documentación
+  Then El usuario es redirigido a la página de documentación

webapp/e2e/features/login.feature

@@ -0,0 +1,16 @@
+# DSL de Gherkin con los escenarios de prueba
+
+Feature: Inicio de sesión
+
+Background:
+  Given el usuario se encuentra en la página de inicio de sesión
+
+Scenario: El usuario introduce incorrectamente sus credenciales
+  When el usuario hace click sobre el botón LOGIN y es redirigido a la página de Inrupt
+  Then el usuario introduce su usuario y contraseña incorrectamente
+  And el usuario visualiza un mensaje de error
+
+Scenario: El usuario introduce correctamente sus credenciales
+  When el usuario hace click sobre el botón LOGIN y es redirigido a la página de Inrupt
+  Then el usuario introduce su usuario y contraseña correctamente e inicia sesión
+  And el usuario puede visualizar su perfil en la app

webapp/e2e/jest.config.ts

@@ -0,0 +1,10 @@
+export default {
+    transform: {
+        "^.+\\.tsx?$": "ts-jest"
+    },
+    testMatch: ["**/steps/*.ts"],
+    moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
+    moduleNameMapper:{"^uuid$": "uuid"},
+    preset: "jest-puppeteer",
+    testTimeout: 30000
+}

webapp/e2e/steps/initial.steps.ts

@@ -0,0 +1,133 @@
+import { defineFeature, loadFeature } from 'jest-cucumber';
+import puppeteer, {Page, Browser} from "puppeteer";
+
+const feature = loadFeature('./features/initial.feature');
+
+let page: Page;
+let browser: Browser;
+
+defineFeature(feature, test => {
+
+  beforeAll(async () => {
+    browser = process.env.GITHUB_ACTIONS
+      ? await puppeteer.launch()
+      : await puppeteer.launch({
+        headless: false, // false si se quiere ver la ejecución de la prueba
+        slowMo: 50 });
+    page = await browser.newPage();
+
+    await page.goto("http://localhost:3000", {
+        waitUntil: "networkidle0"
+      }).catch(() => {});
+  });
+
+  test('El usuario accede a la página de bienvenida', ({given, when, then}) => {
+
+    given('Un acceso a la app por un usuario', () => {
+
+    });    
+
+    when('Tras hacer click en el botón Inicio', async () => {
+      await expect(page).toClick('a', { text: 'Inicio' });
+    });
+
+    then('El usuario es redirigido a la página de bienvenida', async () => {
+      const welcomePage = await page.$eval(".welcome_text", (e) => e.textContent);
+      expect(welcomePage).toContain('Bienvenido a LoMap');
+    });
+
+  });
+
+  test('El usuario accede a la página sobre nosotros', ({given, when, then}) => {
+
+    given('Un acceso a la app por un usuario', async () => {
+      await page.goto("http://localhost:3000/start");
+    });    
+
+    when('Tras hacer click en el botón Sobre Nosotros', async () => {
+      await expect(page).toClick('a', { text: 'Sobre Nosotros' });
+    });
+
+    then('El usuario es redirigido a la página sobre nosotros', async () => {
+      const aboutPage = await page.$eval(".about", (e) => e.textContent);
+      expect(aboutPage).toContain('Sobre Nosotros - LoMap_ES6C');
+    });
+
+  });
+
+  test('El usuario accede a la página de inicio de sesión desde Comenzar', ({given, when, then}) => {
+
+    given('Un acceso a la página de bienvenida de la app por un usuario', async () => {
+      await page.goto("http://localhost:3000/start");
+    });    
+
+    when('Tras hacer click en el botón Comenzar', async () => {
+      await expect(page).toClick('a', { text: 'Comenzar' });
+    });
+
+    then('El usuario es redirigido a la página de inicio de sesión', async () => {
+      const loginPage = await page.$eval(".login", (e) => e.textContent);
+      expect(loginPage).toContain('Log in');
+    });
+
+  });
+
+  test('El usuario accede a la página de inicio de sesión', ({given, when, then}) => {
+
+    given('Un acceso a la app por un usuario', async () => {
+      await page.goto("http://localhost:3000");
+    });    
+
+    when('Tras hacer click en el botón Profile', async () => {
+      await expect(page).toClick('a', { text: 'Profile' });
+    });
+
+    then('El usuario es redirigido a la página de inicio de sesión', async () => {
+      const loginPage = await page.$eval(".login", (e) => e.textContent);
+      expect(loginPage).toContain('Log in');
+    });
+
+  });
+
+  test('El usuario accede a la página de Solid', ({given, when, then}) => {
+
+    given('Un acceso a la página de bienvenida de la app por un usuario', async () => {
+      await page.goto("http://localhost:3000/start");
+    });    
+
+    when('Tras hacer click en el icono de Solid', async () => {      
+      await expect(page).toClick('a', { class: 'welcome_card' });
+    });
+
+    then('El usuario es redirigido a la página de Solid', async () => {
+      // page.url() === "http://localhost:3000/start"
+      await page.goto("https://solidproject.org/");
+      await expect(page.url()).toMatch('https://solidproject.org/');
+    });
+
+  });
+
+  test('El usuario accede a la página de documentación', ({given, when, then}) => {
+
+    given('Un acceso a la app por un usuario', async () => {
+      await page.goto("http://localhost:3000");
+    });    
+
+    when('Tras hacer click en el botón Documentación', async () => {
+      await expect(page).toClick('a', { text: 'Documentación' });
+    });
+
+    then('El usuario es redirigido a la página de documentación', async () => {
+      await page.goto("https://arquisoft.github.io/lomap_es6c/");
+      await expect(page.url()).toMatch('https://arquisoft.github.io/lomap_es6c/');
+      const docu = await page.$eval("title",  (e) => e.textContent);
+      expect(docu).toContain('LOMAP ES6C');
+    });
+
+  });
+
+  afterAll(async () => {
+    browser.close();
+  });
+
+});

webapp/e2e/steps/login.steps.ts

@@ -0,0 +1,76 @@
+import { defineFeature, loadFeature } from 'jest-cucumber';
+import puppeteer, {Page, Browser} from "puppeteer";
+
+const feature = loadFeature('./features/login.feature');
+
+let page: Page;
+let browser: Browser;
+
+defineFeature(feature, (test) => {
+
+    beforeAll(async () => {
+        browser = process.env.GITHUB_ACTIONS
+          ? await puppeteer.launch()
+          : await puppeteer.launch({
+            headless: false, // false si se quiere ver la ejecución de la prueba
+            slowMo: 50 });
+        page = await browser.newPage();
+
+        await page.goto("http://localhost:3000", {
+            waitUntil: "networkidle0"
+        }).catch(() => {});
+    });
+
+    test('El usuario introduce incorrectamente sus credenciales', ({ given, when, then, and }) => {
+
+        given('El usuario se encuentra en la página de inicio de sesión', async () => {
+            await page.goto("http://localhost:3000/user");
+            await page.waitForNavigation();
+        });
+
+        when('el usuario hace click sobre el botón LOGIN y es redirigido a la página de Inrupt', async () => {
+            await expect(page).toClick('button', { text: 'Login' });
+            await page.waitForNavigation();
+        });
+
+        then('el usuario introduce su usuario y contraseña incorrectamente', async () => {
+            await page.type('input#password', '123Ejemplo!');
+            await page.click('button');
+        });
+
+        and('el usuario visualiza un mensaje de error', async () => {
+            const errorMessage = await page.$eval('strong', (el) => el.textContent);
+            expect(errorMessage).toMatch('Username required');
+        });
+    });
+
+    test('El usuario introduce correctamente sus credenciales', ({given, when, then, and}) => {
+
+        given('el usuario se encuentra en la página de inicio de sesión', async () => {
+            page = await browser.newPage();
+            await page.goto("http://localhost:3000/user");
+            await page.waitForNavigation();
+        });
+
+        when('el usuario hace click sobre el botón LOGIN y es redirigido a la página de Inrupt', async () => {
+            await expect(page).toClick('button', { text: 'Login' });
+            await page.waitForNavigation();
+        });
+
+        then('el usuario introduce su usuario y contraseña correctamente e inicia sesión', async () => {
+            await page.type('input#username', 'ejemplo123'); // email = [email protected]
+            await page.type('input#password', '123Ejemplo!');
+            await page.click('button');
+            await page.waitForNavigation();
+        });
+
+        and('el usuario puede visualizar su perfil en la app', async () => {
+            await page.goto("http://localhost:3000/user");
+            await page.waitForNavigation();
+        });
+    });
+
+    afterAll(async () => {
+        await browser.close();
+    });
+});