Fix flakes in fit addon integration tests

This commit is contained in:
Daniel Imms
2024-07-05 08:13:03 -07:00
parent 7b2e8a6ce1
commit a7b248ea9b
+16 -21
View File
@@ -10,12 +10,14 @@ import { ITestContext, createTestContext, openTerminal, timeout } from '../../..
let ctx: ITestContext; let ctx: ITestContext;
test.beforeAll(async ({ browser }) => { test.beforeAll(async ({ browser }) => {
ctx = await createTestContext(browser); ctx = await createTestContext(browser);
ctx.page.setViewportSize({ width: 1024, height: 768 });
await openTerminal(ctx); await openTerminal(ctx);
}); });
test.afterAll(async () => await ctx.page.close()); test.afterAll(async () => await ctx.page.close());
test.describe('FitAddon', () => { test.describe('FitAddon', () => {
test.beforeEach(async function(): Promise<any> { test.beforeEach(async function(): Promise<any> {
await ctx.page.evaluate(`document.querySelector('#terminal-container').style.display=''`);
await ctx.page.evaluate(` await ctx.page.evaluate(`
window.term.reset() window.term.reset()
window.fit?.dispose(); window.fit?.dispose();
@@ -38,15 +40,14 @@ test.describe('FitAddon', () => {
// }); // });
test('no terminal', async function(): Promise<any> { test('no terminal', async function(): Promise<any> {
await ctx.page.evaluate(`window.fit = new FitAddon();`); await ctx.page.evaluate(`window.fit2 = new FitAddon();`);
strictEqual(await ctx.page.evaluate(`window.fit.proposeDimensions()`), undefined); strictEqual(await ctx.page.evaluate(`window.fit2.proposeDimensions()`), undefined);
await ctx.page.evaluate(`window.fit2.dispose();`);
}); });
test.describe('proposeDimensions', () => { test.describe('proposeDimensions', () => {
// test.afterEach(() => unloadFit());
test('default', async function(): Promise<any> { test('default', async function(): Promise<any> {
await loadFit(); await setDimensions();
const dimensions: {cols: number, rows: number} = await ctx.page.evaluate(`window.fit.proposeDimensions()`); const dimensions: {cols: number, rows: number} = await ctx.page.evaluate(`window.fit.proposeDimensions()`);
ok(dimensions.cols > 85); ok(dimensions.cols > 85);
ok(dimensions.cols < 88); ok(dimensions.cols < 88);
@@ -55,7 +56,7 @@ test.describe('FitAddon', () => {
}); });
test('width', async function(): Promise<any> { test('width', async function(): Promise<any> {
await loadFit(1008); await setDimensions(1008);
const dimensions: {cols: number, rows: number} = await ctx.page.evaluate(`window.fit.proposeDimensions()`); const dimensions: {cols: number, rows: number} = await ctx.page.evaluate(`window.fit.proposeDimensions()`);
ok(dimensions.cols > 108); ok(dimensions.cols > 108);
ok(dimensions.cols < 111); ok(dimensions.cols < 111);
@@ -64,7 +65,7 @@ test.describe('FitAddon', () => {
}); });
test('small', async function(): Promise<any> { test('small', async function(): Promise<any> {
await loadFit(1, 1); await setDimensions(1, 1);
deepEqual(await ctx.page.evaluate(`window.fit.proposeDimensions()`), { deepEqual(await ctx.page.evaluate(`window.fit.proposeDimensions()`), {
cols: 2, cols: 2,
rows: 1 rows: 1
@@ -76,7 +77,7 @@ test.describe('FitAddon', () => {
await ctx.page.evaluate(`document.querySelector('#terminal-container').style.display='none'`); await ctx.page.evaluate(`document.querySelector('#terminal-container').style.display='none'`);
await ctx.page.evaluate(`window.term = new Terminal()`); await ctx.page.evaluate(`window.term = new Terminal()`);
await ctx.page.evaluate(`window.term.open(document.querySelector('#terminal-container'))`); await ctx.page.evaluate(`window.term.open(document.querySelector('#terminal-container'))`);
await loadFit(); await setDimensions();
const dimensions: { cols: number, rows: number } | undefined = await ctx.page.evaluate(`window.fit.proposeDimensions()`); const dimensions: { cols: number, rows: number } | undefined = await ctx.page.evaluate(`window.fit.proposeDimensions()`);
// The value of dims will be undefined if the char measure strategy falls back to the DOM // The value of dims will be undefined if the char measure strategy falls back to the DOM
// method, so only assert if it's not undefined. // method, so only assert if it's not undefined.
@@ -86,15 +87,12 @@ test.describe('FitAddon', () => {
ok(dimensions.rows > 24); ok(dimensions.rows > 24);
ok(dimensions.rows < 29); ok(dimensions.rows < 29);
} }
await ctx.page.evaluate(`document.querySelector('#terminal-container').style.display='block'`);
}); });
}); });
test.describe('fit', () => { test.describe('fit', () => {
test.afterEach(() => unloadFit());
test('default', async function(): Promise<any> { test('default', async function(): Promise<any> {
await loadFit(); await setDimensions();
await ctx.page.evaluate(`window.fit.fit()`); await ctx.page.evaluate(`window.fit.fit()`);
const cols: number = await ctx.proxy.cols; const cols: number = await ctx.proxy.cols;
const rows: number = await ctx.proxy.rows; const rows: number = await ctx.proxy.rows;
@@ -105,7 +103,7 @@ test.describe('FitAddon', () => {
}); });
test('width', async function(): Promise<any> { test('width', async function(): Promise<any> {
await loadFit(1008); await setDimensions(1008);
await ctx.page.evaluate(`window.fit.fit()`); await ctx.page.evaluate(`window.fit.fit()`);
const cols: number = await ctx.proxy.cols; const cols: number = await ctx.proxy.cols;
const rows: number = await ctx.proxy.rows; const rows: number = await ctx.proxy.rows;
@@ -116,7 +114,7 @@ test.describe('FitAddon', () => {
}); });
test('small', async function(): Promise<any> { test('small', async function(): Promise<any> {
await loadFit(1, 1); await setDimensions(1, 1);
await ctx.page.evaluate(`window.fit.fit()`); await ctx.page.evaluate(`window.fit.fit()`);
strictEqual(await ctx.proxy.cols, 2); strictEqual(await ctx.proxy.cols, 2);
strictEqual(await ctx.proxy.rows, 1); strictEqual(await ctx.proxy.rows, 1);
@@ -124,15 +122,12 @@ test.describe('FitAddon', () => {
}); });
}); });
async function loadFit(width: number = 800, height: number = 450): Promise<void> { async function setDimensions(width: number = 800, height: number = 450): Promise<void> {
await ctx.page.evaluate(` await ctx.page.evaluate(`
window.fit = new FitAddon();
window.term.loadAddon(window.fit);
document.querySelector('#terminal-container').style.width='${width}px'; document.querySelector('#terminal-container').style.width='${width}px';
document.querySelector('#terminal-container').style.height='${height}px'; document.querySelector('#terminal-container').style.height='${height}px';
document.querySelector('#terminal-container').style.display='';
`); `);
} // HACK: Await a short period as hiding #terminal-container can mess with other tests
await timeout(500);
async function unloadFit(): Promise<void> {
await ctx.page.evaluate(`window.fit.dispose();`);
} }