MM-25003_Improve Onboarding screens for the desktop app - Intro Screen (#2220)

This commit is contained in:
Julian Mondragón
2022-08-16 12:33:03 -05:00
committed by GitHub
parent d4282d965e
commit faf2dae74b
50 changed files with 1815 additions and 42 deletions

View File

@@ -7,6 +7,7 @@
const robot = require('robotjs');
const env = require('../../modules/environment');
const {asyncSleep} = require('../../modules/utils');
describe('startup/app', function desc() {
this.timeout(30000);
@@ -15,6 +16,11 @@ describe('startup/app', function desc() {
env.createTestUserDataDir();
env.cleanTestConfig();
this.app = await env.getApp();
// Skip welcome screen modal
const welcomeScreenModal = this.app.windows().find((window) => window.url().includes('welcomeScreen'));
welcomeScreenModal.click('.WelcomeScreen .WelcomeScreen__button');
await asyncSleep(500);
});
afterEach(async () => {
@@ -41,10 +47,10 @@ describe('startup/app', function desc() {
existingModal.should.not.be.null;
});
it('MM-T4399_2 should show no servers configured in dropdown when no servers exist', async () => {
it('MM-T4985 should show app name in title bar when no servers exist', async () => {
const mainWindow = this.app.windows().find((window) => window.url().includes('index'));
const dropdownButtonText = await mainWindow.innerText('.TeamDropdownButton');
dropdownButtonText.should.equal('No servers configured');
const titleBarText = await mainWindow.innerText('.app-title');
titleBarText.should.equal('Mattermost');
});
it('MM-T4400 should be stopped when the app instance already exists', (done) => {
@@ -62,4 +68,20 @@ describe('startup/app', function desc() {
done(new Error('Second app instance exists'));
});
});
it('MM-T4975 should show the welcome screen modal when no servers exist', async () => {
if (this.app) {
await this.app.close();
}
await env.clearElectronInstances();
env.createTestUserDataDir();
env.cleanTestConfig();
this.app = await env.getApp();
await asyncSleep(500);
const welcomeScreenModal = this.app.windows().find((window) => window.url().includes('welcomeScreen'));
const modalButton = await welcomeScreenModal.innerText('.WelcomeScreen .WelcomeScreen__button');
modalButton.should.equal('Get Started');
});
});

View File

@@ -0,0 +1,142 @@
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
'use strict';
const env = require('../../modules/environment');
const {asyncSleep} = require('../../modules/utils');
describe('Welcome Screen Modal', function desc() {
this.timeout(30000);
beforeEach(async () => {
env.createTestUserDataDir();
env.cleanTestConfig();
await asyncSleep(1000);
this.app = await env.getApp();
welcomeScreenModal = this.app.windows().find((window) => window.url().includes('welcomeScreen'));
});
afterEach(async () => {
if (this.app) {
await this.app.close();
}
await env.clearElectronInstances();
});
let welcomeScreenModal;
it('MM-T4976 should show the slides in the expected order', async () => {
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const channelSlideClass = await welcomeScreenModal.getAttribute('#channels', 'class');
channelSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const playbooksSlideClass = await welcomeScreenModal.getAttribute('#playbooks', 'class');
playbooksSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const boardsSlideClass = await welcomeScreenModal.getAttribute('#boards', 'class');
boardsSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4977 should be able to move through slides clicking the navigation buttons', async () => {
let welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const channelSlideClass = await welcomeScreenModal.getAttribute('#channels', 'class');
channelSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#prevCarouselButton');
welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4978 should be able to move through slides clicking the pagination indicator', async () => {
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#PaginationIndicator3');
const boardsSlideClass = await welcomeScreenModal.getAttribute('#boards', 'class');
boardsSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#PaginationIndicator2');
const playbooksSlideClass = await welcomeScreenModal.getAttribute('#playbooks', 'class');
playbooksSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4979 should be able to move forward through slides automatically every 5 seconds', async () => {
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await asyncSleep(5500);
const channelSlideClass = await welcomeScreenModal.getAttribute('#channels', 'class');
channelSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4980 should show the slides in the expected order', async () => {
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const channelSlideClass = await welcomeScreenModal.getAttribute('#channels', 'class');
channelSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const playbooksSlideClass = await welcomeScreenModal.getAttribute('#playbooks', 'class');
playbooksSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const boardsSlideClass = await welcomeScreenModal.getAttribute('#boards', 'class');
boardsSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4981 should be able to move from last to first slide', async () => {
await welcomeScreenModal.click('#PaginationIndicator3');
const boardsSlideClass = await welcomeScreenModal.getAttribute('#boards', 'class');
boardsSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#nextCarouselButton');
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4982 should be able to move from first to last slide', async () => {
const welcomeSlideClass = await welcomeScreenModal.getAttribute('#welcome', 'class');
welcomeSlideClass.should.contain('Carousel__slide-current');
await welcomeScreenModal.click('#prevCarouselButton');
const boardsSlideClass = await welcomeScreenModal.getAttribute('#boards', 'class');
boardsSlideClass.should.contain('Carousel__slide-current');
});
it('MM-T4983 should be able to click the get started button and be redirected to new server modal', async () => {
await welcomeScreenModal.click('#getStartedWelcomeScreen');
const newServerModal = await this.app.waitForEvent('window', {
predicate: (window) => window.url().includes('newServer'),
});
const modalTitle = await newServerModal.innerText('#newServerModal .modal-title');
modalTitle.should.equal('Add Server');
});
});