[MM-22239] Downloads dropdown (#2227)
* WIP: show/hide temp downloads dropdown * WIP: Position downloads dropdown correctly under the button * WIP: Use correct width for dropdown so that right radius and shadows are displayed * WIP: Add items to download list after finished downloading * WIP: Add download item base components * Add "clear all" functionality * Use type Record<> for downloads saved in config * Add styling to files in the downloads dropdown * Open file in folder when clicking it from downloads dropdown. Center svg in parent element * Update scrollbar styling * Update scrollbar styling * Update state of downloaded items if deleted from folder * Add progress bar in downloads * Use "x-uncompressed-content-length" in file downloads. * Keep downloads open when clicking outside their browserview * Use correct color for downloads dropdown button * Add better styling to downloads dropdown button * Allow only 50 download files maximum. Oldest file is being removed if reached * Autoclose downloads dropdown after 4s of download finish * Add file thumbnails * Dont show second dialog if first dismissed * Add red badge when downloads running and dropdown closed * Add menu item for Downloads * Add support for more code file extensions * Open downloads dropdown instead of folder from the menu * Run lint:js and fix problems * Add tests for utils * Fix issue with dropdown not displaying * Remove unecessary comment * Move downloads to separate json file, outside Config * Add downloads dropdown menu for the 3-dot button * Dont show dev tools for downloads * Add cancel download functionality * Add dark mode styling * Use View state for downloadsMenu open state * Fix some style issues * Add image preview for downloaded images * Remove extra devTool in weback config * Fix issue with paths on windows * Align items left in downloads menu * Use pretty-bytes for file sizes * Show download remaining time * Close downloads dropdown when clicking outside * Show different units in received bytes when they are different from the total units (kb/mb) * Dont hide downloads when mattermost view is clicked * Keep downloads open if download button is clicked * Use closest() to check for download clicks * Fix unit tests. Add tests for new Views and downloadManager Add @types/jest as devDependency for intellisense * Remove unecessary tsconfig for jest * Fix types error * Add all critical tests for downloadsManager * WIP: add e2e tests for downloads * WIP: add e2e tests for downloads * Rename downloads spec file * WIP: make vscode debugger work for e2e tests * Remove unused mock * Remove defaults for v4 config * Use electron-mocha for e2e debugger * Fix e2e tests spawning JsonFileManager twice * Add async fs functions and add tests for download item UI * Add async fs functions and add tests for download item UI * Improve tests with "waitForSelector" to wait for visible elements * Wait for page load before assertions * Add tests for file uploads/downloads * Dont show native notification for completed downloads if dropdown is open * Increment filenames if file already exists * Fix antializing in downloads dropdown * Fix styling of downloads header * Increase dimensions of green/red icons in downloads * Fix styling of 3-dot button * Fix unit tests * Show 3-dot button only on hover or click * PR review fixes * Revert vscode debug fixes * Mock fs.constants * Mock fs instead of JsonFileManager in downlaods tests * Mock fs instead of JsonFileManager in downlaods tests * Add necessary mocks for downloads manager * Mark file as deleted if user deleted it * Fix min-height of downloads dropdown and 3-dot icon position * Add more tests * Make size of downloads dropdown dynamic based on content * Combine log statements * Close 3-dot menu if user clicks elsewhere * Move application updates inside downloads dropdown * Fix update issues * Fix ipc event payload * Add missing prop * Remove unused translations * Fix failing test * Fix version unknown * Remove commented out component
This commit is contained in:
@@ -15,7 +15,7 @@ const {ipcRenderer} = require('electron');
|
||||
|
||||
const {SHOW_SETTINGS_WINDOW} = require('../../src/common/communication');
|
||||
|
||||
const {asyncSleep} = require('./utils');
|
||||
const {asyncSleep, mkDirAsync, rmDirAsync, unlinkAsync} = require('./utils');
|
||||
chai.should();
|
||||
|
||||
const sourceRootDir = path.join(__dirname, '../..');
|
||||
@@ -28,6 +28,8 @@ const electronBinaryPath = (() => {
|
||||
})();
|
||||
const userDataDir = path.join(sourceRootDir, 'e2e/testUserData/');
|
||||
const configFilePath = path.join(userDataDir, 'config.json');
|
||||
const downloadsFilePath = path.join(userDataDir, 'downloads.json');
|
||||
const downloadsLocation = path.join(userDataDir, 'Downloads');
|
||||
const boundsInfoPath = path.join(userDataDir, 'bounds-info.json');
|
||||
const appUpdatePath = path.join(userDataDir, 'app-update.yml');
|
||||
const exampleURL = 'http://example.com/';
|
||||
@@ -51,12 +53,10 @@ const exampleTeam = {
|
||||
{
|
||||
name: 'TAB_FOCALBOARD',
|
||||
order: 1,
|
||||
isOpen: true,
|
||||
},
|
||||
{
|
||||
name: 'TAB_PLAYBOOKS',
|
||||
order: 2,
|
||||
isOpen: true,
|
||||
},
|
||||
],
|
||||
lastActiveTab: 0,
|
||||
@@ -100,10 +100,14 @@ const demoConfig = {
|
||||
useSpellChecker: true,
|
||||
enableHardwareAcceleration: true,
|
||||
autostart: true,
|
||||
hideOnStart: false,
|
||||
spellCheckerLocales: [],
|
||||
darkMode: false,
|
||||
lastActiveTeam: 0,
|
||||
spellCheckerLocales: [],
|
||||
startInFullscreen: false,
|
||||
autoCheckForUpdates: false,
|
||||
appLanguage: 'en',
|
||||
logLevel: 'silly',
|
||||
};
|
||||
|
||||
const demoMattermostConfig = {
|
||||
@@ -119,6 +123,8 @@ const cmdOrCtrl = process.platform === 'darwin' ? 'command' : 'control';
|
||||
module.exports = {
|
||||
sourceRootDir,
|
||||
configFilePath,
|
||||
downloadsFilePath,
|
||||
downloadsLocation,
|
||||
userDataDir,
|
||||
boundsInfoPath,
|
||||
appUpdatePath,
|
||||
@@ -147,7 +153,7 @@ module.exports = {
|
||||
},
|
||||
|
||||
cleanTestConfig() {
|
||||
[configFilePath, boundsInfoPath].forEach((file) => {
|
||||
[configFilePath, downloadsFilePath, boundsInfoPath].forEach((file) => {
|
||||
try {
|
||||
fs.unlinkSync(file);
|
||||
} catch (err) {
|
||||
@@ -158,6 +164,13 @@ module.exports = {
|
||||
}
|
||||
});
|
||||
},
|
||||
async cleanTestConfigAsync() {
|
||||
await Promise.all(
|
||||
[configFilePath, downloadsFilePath, boundsInfoPath].map((file) => {
|
||||
return unlinkAsync(file);
|
||||
}),
|
||||
);
|
||||
},
|
||||
|
||||
cleanDataDir() {
|
||||
try {
|
||||
@@ -169,28 +182,35 @@ module.exports = {
|
||||
}
|
||||
}
|
||||
},
|
||||
cleanDataDirAsync() {
|
||||
return rmDirAsync(userDataDir);
|
||||
},
|
||||
|
||||
createTestUserDataDir() {
|
||||
if (!fs.existsSync(userDataDir)) {
|
||||
fs.mkdirSync(userDataDir);
|
||||
}
|
||||
},
|
||||
async createTestUserDataDirAsync() {
|
||||
await mkDirAsync(userDataDir);
|
||||
},
|
||||
|
||||
async getApp(args = []) {
|
||||
const options = {
|
||||
downloadsPath: downloadsLocation,
|
||||
env: {
|
||||
...process.env,
|
||||
RESOURCES_PATH: userDataDir,
|
||||
},
|
||||
executablePath: electronBinaryPath,
|
||||
args: [`${path.join(sourceRootDir, 'dist')}`, `--data-dir=${userDataDir}`, '--disable-dev-mode', ...args],
|
||||
args: [`${path.join(sourceRootDir, 'dist')}`, `--user-data-dir=${userDataDir}`, '--disable-dev-mode', ...args],
|
||||
};
|
||||
|
||||
// if (process.env.MM_DEBUG_SETTINGS) {
|
||||
// options.chromeDriverLogPath = './chromedriverlog.txt';
|
||||
// }
|
||||
// if (process.platform === 'darwin' || process.platform === 'linux') {
|
||||
// // on a mac, debbuging port might conflict with other apps
|
||||
// // on a mac, debugging port might conflict with other apps
|
||||
// // this changes the default debugging port so chromedriver can run without issues.
|
||||
// options.chromeDriverArgs.push('remote-debugging-port=9222');
|
||||
//}
|
||||
@@ -242,6 +262,27 @@ module.exports = {
|
||||
await window.click('#saveSetting');
|
||||
},
|
||||
|
||||
async openDownloadsDropdown(app) {
|
||||
const mainWindow = app.windows().find((window) => window.url().includes('index'));
|
||||
await mainWindow.waitForLoadState();
|
||||
await mainWindow.bringToFront();
|
||||
|
||||
const dlButtonLocator = await mainWindow.waitForSelector('.DownloadsDropdownButton');
|
||||
await dlButtonLocator.click();
|
||||
await asyncSleep(500);
|
||||
|
||||
const downloadsWindow = app.windows().find((window) => window.url().includes('downloadsDropdown'));
|
||||
await downloadsWindow.waitForLoadState();
|
||||
await downloadsWindow.bringToFront();
|
||||
return downloadsWindow;
|
||||
},
|
||||
|
||||
async downloadsDropdownIsOpen(app) {
|
||||
const downloadsWindow = app.windows().find((window) => window.url().includes('downloadsDropdown'));
|
||||
const result = await downloadsWindow.isVisible('.DownloadsDropdown');
|
||||
return result;
|
||||
},
|
||||
|
||||
addClientCommands(client) {
|
||||
client.addCommand('loadSettingsPage', function async() {
|
||||
ipcRenderer.send(SHOW_SETTINGS_WINDOW);
|
||||
|
@@ -1,6 +1,7 @@
|
||||
// Copyright (c) 2015-2016 Yuya Ochiai
|
||||
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
const fs = require('fs');
|
||||
|
||||
function asyncSleep(timeout) {
|
||||
return new Promise((resolve) => {
|
||||
@@ -10,6 +11,92 @@ function asyncSleep(timeout) {
|
||||
});
|
||||
}
|
||||
|
||||
function dirExistsAsync(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
fs.stat(path, (error, stats) => {
|
||||
if (error) {
|
||||
if (error.code === 'ENOENT') {
|
||||
resolve(false);
|
||||
} else {
|
||||
reject(error);
|
||||
}
|
||||
return;
|
||||
}
|
||||
resolve(stats.isDirectory());
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function mkDirAsync(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
dirExistsAsync(path).then((exists) => {
|
||||
if (!exists) {
|
||||
fs.mkdir(path, {recursive: true}, (error) => {
|
||||
if (error) {
|
||||
reject(error);
|
||||
return;
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
}
|
||||
}).catch((err) => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function rmDirAsync(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
dirExistsAsync(path).then((exists) => {
|
||||
if (exists) {
|
||||
fs.rm(path, {recursive: true, force: true}, (error) => {
|
||||
if (error) {
|
||||
if (error.code === 'ENOENT') {
|
||||
resolve();
|
||||
}
|
||||
reject(error);
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
}
|
||||
resolve();
|
||||
}).catch((err) => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function unlinkAsync(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
fs.unlink(path, (error) => {
|
||||
if (error) {
|
||||
if (error.code === 'ENOENT') {
|
||||
resolve();
|
||||
}
|
||||
reject(error);
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function writeFileAsync(path, data) {
|
||||
return new Promise((resolve, reject) => {
|
||||
fs.writeFile(path, data, (err) => {
|
||||
if (err) {
|
||||
reject(err);
|
||||
return;
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
asyncSleep,
|
||||
dirExistsAsync,
|
||||
mkDirAsync,
|
||||
rmDirAsync,
|
||||
unlinkAsync,
|
||||
writeFileAsync,
|
||||
};
|
||||
|
193
e2e/specs/downloads/downloads_dropdown_items.test.js
Normal file
193
e2e/specs/downloads/downloads_dropdown_items.test.js
Normal file
@@ -0,0 +1,193 @@
|
||||
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
'use strict';
|
||||
|
||||
const path = require('path');
|
||||
|
||||
const env = require('../../modules/environment');
|
||||
const {asyncSleep, mkDirAsync, rmDirAsync, writeFileAsync} = require('../../modules/utils');
|
||||
|
||||
const config = env.demoConfig;
|
||||
|
||||
const file1 = {
|
||||
addedAt: Date.UTC(2022, 8, 8, 10), // Aug 08, 2022 10:00AM UTC
|
||||
filename: 'file1.txt',
|
||||
mimeType: 'plain/text',
|
||||
location: path.join(env.downloadsLocation, 'file1.txt'),
|
||||
progress: 100,
|
||||
receivedBytes: 3917388,
|
||||
state: 'completed',
|
||||
totalBytes: 3917388,
|
||||
type: 'file',
|
||||
};
|
||||
const file2 = {
|
||||
addedAt: Date.UTC(2022, 8, 8, 11), // Aug 08, 2022 11:00AM UTC
|
||||
filename: 'file2.txt',
|
||||
mimeType: 'plain/text',
|
||||
location: path.join(env.downloadsLocation, 'file2.txt'),
|
||||
progress: 100,
|
||||
receivedBytes: 7917388,
|
||||
state: 'completed',
|
||||
totalBytes: 7917388,
|
||||
type: 'file',
|
||||
};
|
||||
|
||||
describe('downloads/downloads_dropdown_items', function desc() {
|
||||
this.timeout(30000);
|
||||
|
||||
describe('The list has one downloaded file', () => {
|
||||
const downloads = {
|
||||
[file1.filename]: file1,
|
||||
};
|
||||
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify(downloads));
|
||||
await mkDirAsync(env.downloadsLocation);
|
||||
await writeFileAsync(path.join(env.downloadsLocation, 'file1.txt'), 'file1 content');
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
this.downloadsWindow = await env.openDownloadsDropdown(this.app);
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await rmDirAsync(env.downloadsLocation);
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should display the file correctly (downloaded)', async () => {
|
||||
const filenameTextLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__Filename');
|
||||
const filenameInnerText = await filenameTextLocator.innerText();
|
||||
filenameInnerText.should.equal(downloads['file1.txt'].filename);
|
||||
|
||||
const fileStateLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__FileSizeAndStatus');
|
||||
const fileStateInnerText = await fileStateLocator.innerText();
|
||||
fileStateInnerText.should.equal('3.92 MB • Downloaded');
|
||||
|
||||
const fileThumbnailLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Thumbnail');
|
||||
const thumbnailBackgroundImage = await fileThumbnailLocator.evaluate((node) => window.getComputedStyle(node).getPropertyValue('background-image'));
|
||||
thumbnailBackgroundImage.should.include('text..svg');
|
||||
});
|
||||
});
|
||||
|
||||
describe('The list has one downloaded file but it is deleted from the folder', () => {
|
||||
const downloads = {
|
||||
[file1.filename]: file1,
|
||||
};
|
||||
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify(downloads));
|
||||
await mkDirAsync(env.downloadsLocation);
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
this.downloadsWindow = await env.openDownloadsDropdown(this.app);
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await rmDirAsync(env.downloadsLocation);
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should display the file correctly (deleted)', async () => {
|
||||
const filenameTextLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__Filename');
|
||||
const filenameInnerText = await filenameTextLocator.innerText();
|
||||
filenameInnerText.should.equal(downloads['file1.txt'].filename);
|
||||
|
||||
const fileStateLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__FileSizeAndStatus');
|
||||
const fileStateInnerText = await fileStateLocator.innerText();
|
||||
fileStateInnerText.should.equal('3.92 MB • Deleted');
|
||||
|
||||
const fileThumbnailLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Thumbnail');
|
||||
const thumbnailBackgroundImage = await fileThumbnailLocator.evaluate((node) => window.getComputedStyle(node).getPropertyValue('background-image'));
|
||||
thumbnailBackgroundImage.should.include('text..svg');
|
||||
});
|
||||
});
|
||||
|
||||
describe('The list has one cancelled file', () => {
|
||||
const downloads = {
|
||||
[file1.filename]: {
|
||||
...file1,
|
||||
state: 'progressing',
|
||||
progress: 50,
|
||||
receivedBytes: 1958694,
|
||||
totalBytes: 3917388,
|
||||
},
|
||||
};
|
||||
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify(downloads));
|
||||
await mkDirAsync(env.downloadsLocation);
|
||||
await writeFileAsync(path.join(env.downloadsLocation, 'file1.txt'), 'file1 content');
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
this.downloadsWindow = await env.openDownloadsDropdown(this.app);
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await rmDirAsync(env.downloadsLocation);
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should display the file correctly (cancelled)', async () => {
|
||||
const filenameTextLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__Filename');
|
||||
const filenameInnerText = await filenameTextLocator.innerText();
|
||||
filenameInnerText.should.equal(downloads['file1.txt'].filename);
|
||||
|
||||
const fileStateLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Details__FileSizeAndStatus');
|
||||
const fileStateInnerText = await fileStateLocator.innerText();
|
||||
fileStateInnerText.should.equal('3.92 MB • Cancelled');
|
||||
|
||||
const fileThumbnailLocator = await this.downloadsWindow.waitForSelector('.DownloadsDropdown__File__Body__Thumbnail');
|
||||
const thumbnailBackgroundImage = await fileThumbnailLocator.evaluate((node) => window.getComputedStyle(node).getPropertyValue('background-image'));
|
||||
thumbnailBackgroundImage.should.include('text..svg');
|
||||
});
|
||||
});
|
||||
|
||||
describe('The list has two downloaded files', () => {
|
||||
const downloads = {
|
||||
'file1.txt': file1,
|
||||
'file2.txt': file2,
|
||||
};
|
||||
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify(downloads));
|
||||
await mkDirAsync(env.downloadsLocation);
|
||||
await writeFileAsync(path.join(env.downloadsLocation, 'file1.txt'), 'file1 content');
|
||||
await writeFileAsync(path.join(env.downloadsLocation, 'file2.txt'), 'file2 content');
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
this.downloadsWindow = await env.openDownloadsDropdown(this.app);
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await rmDirAsync(env.downloadsLocation);
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should display the files in correct order', async () => {
|
||||
const filenameTextLocators = this.downloadsWindow.locator('.DownloadsDropdown__File__Body__Details__Filename');
|
||||
(await filenameTextLocators.count()).should.equal(2);
|
||||
const firstItemLocator = filenameTextLocators.first();
|
||||
const file1InnerText = await firstItemLocator.innerText();
|
||||
file1InnerText.should.equal(downloads['file2.txt'].filename); // newest first
|
||||
const secondItemLocator = filenameTextLocators.nth(1);
|
||||
const file2InnerText = await secondItemLocator.innerText();
|
||||
file2InnerText.should.equal(downloads['file1.txt'].filename);
|
||||
});
|
||||
});
|
||||
});
|
84
e2e/specs/downloads/downloads_manager.test.js
Normal file
84
e2e/specs/downloads/downloads_manager.test.js
Normal file
@@ -0,0 +1,84 @@
|
||||
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
'use strict';
|
||||
|
||||
const robot = require('robotjs');
|
||||
|
||||
const env = require('../../modules/environment');
|
||||
const {asyncSleep, rmDirAsync, writeFileAsync} = require('../../modules/utils');
|
||||
|
||||
const config = {
|
||||
...env.demoMattermostConfig,
|
||||
teams: [
|
||||
...env.demoMattermostConfig.teams,
|
||||
{
|
||||
url: 'https://community.mattermost.com',
|
||||
name: 'community',
|
||||
order: 0,
|
||||
tabs: [
|
||||
{
|
||||
name: 'TAB_MESSAGING',
|
||||
order: 0,
|
||||
isOpen: true,
|
||||
},
|
||||
{
|
||||
name: 'TAB_FOCALBOARD',
|
||||
order: 1,
|
||||
},
|
||||
{
|
||||
name: 'TAB_PLAYBOOKS',
|
||||
order: 2,
|
||||
},
|
||||
],
|
||||
lastActiveTab: 0,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
describe('downloads/downloads_manager', function desc() {
|
||||
this.timeout(30000);
|
||||
let firstServer;
|
||||
const filename = `${Date.now().toString()}.txt`;
|
||||
|
||||
beforeEach(async () => {
|
||||
await env.cleanDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await env.createTestUserDataDirAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await asyncSleep(1000);
|
||||
|
||||
this.app = await env.getApp();
|
||||
this.serverMap = await env.getServerMap(this.app);
|
||||
const loadingScreen = this.app.windows().find((window) => window.url().includes('loadingScreen'));
|
||||
await loadingScreen.waitForSelector('.LoadingScreen', {state: 'hidden'});
|
||||
firstServer = this.serverMap[`${config.teams[0].name}___TAB_MESSAGING`].win;
|
||||
await env.loginToMattermost(firstServer);
|
||||
|
||||
const textbox = await firstServer.waitForSelector('#post_textbox');
|
||||
const fileInput = await firstServer.waitForSelector('input[type="file"]');
|
||||
await fileInput.setInputFiles({
|
||||
name: filename,
|
||||
mimeType: 'text/plain',
|
||||
buffer: Buffer.from('this is test file'),
|
||||
});
|
||||
await asyncSleep(1000);
|
||||
await textbox.focus();
|
||||
robot.keyTap('enter');
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await rmDirAsync(env.downloadsLocation);
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should open downloads dropdown when a download starts', async () => {
|
||||
await firstServer.locator('#file-attachment-link', {hasText: filename}).click();
|
||||
await asyncSleep(1000);
|
||||
await Promise.all([
|
||||
firstServer.waitForEvent('download'), // It is important to call waitForEvent before click to set up waiting.
|
||||
firstServer.locator(`div[role="dialog"] a[download="${filename}"]`).click(), // Triggers the download.
|
||||
]);
|
||||
(await env.downloadsDropdownIsOpen(this.app)).should.equal(true);
|
||||
});
|
||||
});
|
126
e2e/specs/downloads/downloads_menubar.test.js
Normal file
126
e2e/specs/downloads/downloads_menubar.test.js
Normal file
@@ -0,0 +1,126 @@
|
||||
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
'use strict';
|
||||
|
||||
const path = require('path');
|
||||
|
||||
const env = require('../../modules/environment');
|
||||
const {asyncSleep, writeFileAsync} = require('../../modules/utils');
|
||||
|
||||
const config = env.demoConfig;
|
||||
|
||||
const downloads = {
|
||||
'file1.txt': {
|
||||
addedAt: Date.UTC(2022, 8, 8, 10), // Aug 08, 2022 10:00AM UTC
|
||||
filename: 'file1.txt',
|
||||
mimeType: 'plain/text',
|
||||
location: path.join(env.downloadsLocation, 'file1.txt'),
|
||||
progress: 100,
|
||||
receivedBytes: 3917388,
|
||||
state: 'completed',
|
||||
totalBytes: 3917388,
|
||||
type: 'file',
|
||||
},
|
||||
};
|
||||
|
||||
describe('downloads/downloads_menubar', function desc() {
|
||||
this.timeout(30000);
|
||||
|
||||
describe('The download list is empty', () => {
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify({}));
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should not show the downloads dropdown and the menu item should be disabled', async () => {
|
||||
const mainWindow = this.app.windows().find((window) => window.url().includes('index'));
|
||||
await mainWindow.waitForLoadState();
|
||||
await mainWindow.bringToFront();
|
||||
|
||||
const dlButton = mainWindow.locator('.DownloadsDropdownButton');
|
||||
|
||||
(await dlButton.isVisible()).should.equal(false);
|
||||
|
||||
const saveMenuItem = await this.app.evaluate(async ({app}) => {
|
||||
const viewMenu = app.applicationMenu.getMenuItemById('view');
|
||||
const saveItem = viewMenu.submenu.getMenuItemById('app-menu-downloads');
|
||||
|
||||
return saveItem;
|
||||
});
|
||||
|
||||
saveMenuItem.should.haveOwnProperty('enabled', false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('The download list has one file', () => {
|
||||
beforeEach(async () => {
|
||||
await env.createTestUserDataDirAsync();
|
||||
await env.cleanTestConfigAsync();
|
||||
await writeFileAsync(env.configFilePath, JSON.stringify(config));
|
||||
await writeFileAsync(env.downloadsFilePath, JSON.stringify(downloads));
|
||||
await asyncSleep(1000);
|
||||
this.app = await env.getApp();
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
await this.app?.close?.();
|
||||
await env.clearElectronInstances();
|
||||
});
|
||||
|
||||
it('MM-22239 should show the downloads dropdown button and the menu item should be enabled', async () => {
|
||||
const mainWindow = this.app.windows().find((window) => window.url().includes('index'));
|
||||
await mainWindow.waitForLoadState();
|
||||
await mainWindow.bringToFront();
|
||||
|
||||
const dlButton = await mainWindow.waitForSelector('.DownloadsDropdownButton', {state: 'attached'});
|
||||
(await dlButton.isVisible()).should.equal(true);
|
||||
|
||||
const saveMenuItem = await this.app.evaluate(async ({app}) => {
|
||||
const viewMenu = app.applicationMenu.getMenuItemById('view');
|
||||
const saveItem = viewMenu.submenu.getMenuItemById('app-menu-downloads');
|
||||
|
||||
return saveItem;
|
||||
});
|
||||
|
||||
saveMenuItem.should.haveOwnProperty('enabled', true);
|
||||
});
|
||||
|
||||
it('MM-22239 should open the downloads dropdown when clicking the download button in the menubar', async () => {
|
||||
const mainWindow = this.app.windows().find((window) => window.url().includes('index'));
|
||||
await mainWindow.waitForLoadState();
|
||||
await mainWindow.bringToFront();
|
||||
|
||||
const dlButton = await mainWindow.waitForSelector('.DownloadsDropdownButton', {state: 'attached'});
|
||||
(await dlButton.isVisible()).should.equal(true);
|
||||
await dlButton.click();
|
||||
|
||||
await asyncSleep(500);
|
||||
(await env.downloadsDropdownIsOpen(this.app)).should.equal(true);
|
||||
});
|
||||
|
||||
it('MM-22239 should open the downloads dropdown from the app menu', async () => {
|
||||
const mainWindow = this.app.windows().find((window) => window.url().includes('index'));
|
||||
await mainWindow.waitForLoadState();
|
||||
await mainWindow.bringToFront();
|
||||
|
||||
await this.app.evaluate(async ({app}) => {
|
||||
const viewMenu = app.applicationMenu.getMenuItemById('view');
|
||||
const downloadsItem = viewMenu.submenu.getMenuItemById('app-menu-downloads');
|
||||
|
||||
downloadsItem.click();
|
||||
});
|
||||
|
||||
await asyncSleep(500);
|
||||
(await env.downloadsDropdownIsOpen(this.app)).should.equal(true);
|
||||
});
|
||||
});
|
||||
});
|
Reference in New Issue
Block a user