rework the e2e tests to not depend on console.log() and tested the login page

e2e/.gitignore

@@ -1,3 +1,4 @@
 screenshots/
 videos/
-node_modules/
+node_modules/
+cypress/fixtures

e2e/cypress/integration/spec.js

@@ -1,25 +1,26 @@
-Cypress.on('window:before:load', (win) => {
-	// because this is called before any scripts
-	// have loaded - the ga function is undefined
-	// so we need to create it.
-	win.cypressAsserter = cy.stub().as('ca')
-})
-
 describe('WorkAdventureGame', () => {
 	beforeEach(() => {
-		cy.visit('/', {
-			onBeforeLoad (win) {
-				cy.spy(win.console, 'log').as('console.log')
-			},
-		})
+		cy.visit('/', {})
 		
 	});
 
-	it('loads', () => {
-		cy.get('@console.log').should('be.calledWith', 'Started the game')
-		cy.get('@console.log').should('be.calledWith', 'Preloading')
-		cy.get('@console.log').should('be.calledWith', 'Preloading done')
-		cy.get('@console.log').should('be.calledWith', 'startInit')
-		cy.get('@console.log').should('be.calledWith', 'startInit done')
+	it('loads', async () => {
+		let win = await cy.window()
+		expect(win.cypressAsserter.gameStarted).to.equal(true);
+	});
+
+	it('reach the login page', async () => {
+		let win = await cy.window()
+		//todo: find a way to use a spy instead of checcking for a value
+		//cy.spy(win.cypressAsserter, 'reachedLoginScene')
+		//expect(win.cypressAsserter.reachedLoginScene).to.be.called;
+		expect(win.cypressAsserter.loginPage).to.equal(true);
+	});
+
+	it('can connect and get to the gameScene', async () => {
+		let win = await cy.window()
+		cy.spy(win.cypressAsserter, 'reachedGameScene')
+		await win.cypressAsserter.remoteConnect()
+		expect(win.cypressAsserter.reachedGameScene).to.be.called;
 	});
 });

front/src/Cypress/CypressAsserter.ts

@@ -1,31 +1,37 @@
+import {DEBUG_MODE} from "../Enum/EnvironmentVariable";
+import {LogincScene} from "../Phaser/Login/LogincScene";
+
 declare let window:any;
 
 //this class is used to communicate with cypress, our e2e testing client
 //Since cypress cannot manipulate canvas, we notified it with console logs
 class CypressAsserter {
+    gameStarted = false;
+    preload = false;
+    loginPage = false;
+    gameScene = false;
+    private loginScene: LogincScene;
     
     constructor() {
         window.cypressAsserter = this
     }
     
-    gameStarted() {
-        console.log('Started the game')
+    reachedLoginScene(loginScene: LogincScene) {
+        this.loginPage = true
+        this.loginScene = loginScene
+    }
+    
+    async remoteConnect(): Promise<void> {
+        await this.loginScene.loginFromEmail('test@email.com')
+        //we implement this timeout to give Phaser the time needed to change scene
+        return new Promise((r) => {
+            setTimeout(() => r(), 200);
+        })
     }
 
-    preloadStarted() {
-        console.log('Preloading')
-    }
-
-    preloadFinished() {
-        console.log('Preloading done')
-    }
-
-    initStarted() {
-        console.log('startInit')
-    }
-
-    initFinished() {
-        console.log('startInit done')
+    reachedGameScene() {
+        this.loginPage = false;
+        this.gameScene = true;
     }
 }
 

front/src/Phaser/Game/GameScene.ts

@@ -43,7 +43,7 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
 
     //hook preload scene
     preload(): void {
-        cypressAsserter.preloadStarted();
+        cypressAsserter.reachedGameScene();
         let mapUrl = 'maps/map.json';
         this.load.on('filecomplete-tilemapJSON-'+Textures.Map, (key: string, type: string, data: any) => {
             // Triggered when the map is loaded
@@ -63,7 +63,6 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
             'resources/characters/pipoya/Male 01-1.png',
             { frameWidth: 32, frameHeight: 32 }
         );
-        cypressAsserter.preloadFinished();
     }
 
     //hook initialisation
@@ -71,8 +70,6 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
 
     //hook create scene
     create(): void {
-        cypressAsserter.initStarted();
-
         //initalise map
         this.Map = this.add.tilemap("map");
         this.map.tilesets.forEach((tileset: ITiledTileSet) => {
@@ -112,7 +109,6 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
 
         //initialise camera
         this.initCamera();
-        cypressAsserter.initFinished();
     }
 
     //todo: in a dedicated class/function?

front/src/Phaser/Login/LogincScene.ts

@@ -4,6 +4,7 @@ import {ROOM} from "../../Enum/EnvironmentVariable";
 import {TextField} from "../Components/TextField";
 import {TextInput} from "../Components/TextInput";
 import {ClickButton} from "../Components/ClickButton";
+import {cypressAsserter} from "../../Cypress/CypressAsserter";
 
 //todo: put this constants in a dedicated file
 export const LoginSceneName = "LoginScene";
@@ -23,6 +24,7 @@ export class LogincScene extends Phaser.Scene {
     }
     
     preload() {
+        cypressAsserter.reachedLoginScene(this);
         this.load.image(LoginTextures.playButton, "resources/objects/play_button.png");
     }
     
@@ -42,10 +44,14 @@ export class LogincScene extends Phaser.Scene {
         
     }
     
-    async login() {
+    login() {
         let email = this.emailInput.text;
         if (!email) return;
+        return this.loginFromEmail(email);
+    }
+    
+    async loginFromEmail(email: string): Promise<void> {
         await gameManager.connect(email);
         this.scene.start("GameScene");
-    }
+    }  
 }

front/src/index.ts

@@ -20,10 +20,10 @@ const config: GameConfig = {
     }
 };
 
-cypressAsserter.gameStarted();
-
 let game = new Phaser.Game(config);
 
+cypressAsserter.gameStarted = true;
+
 window.addEventListener('resize', function (event) {
     game.scale.resize(window.innerWidth / RESOLUTION, window.innerHeight / RESOLUTION);
 });