Enable add a cell button (#6872)

* Enable add a cell button * workaround for Firefox * Lint --------- Co-authored-by: Jeremy Tuloup <[email protected]>
jupyter · May 16, 2023 · c77ebdc · c77ebdc
1 parent 1728681
commit c77ebdc
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 11 deletions.
diff --git a/packages/notebook-extension/style/base.css b/packages/notebook-extension/style/base.css
@@ -124,8 +124,6 @@ body[data-notebook='notebooks']
 
 /* Tweak the notebook footer (to add a new cell) */
 body[data-notebook='notebooks'] .jp-Notebook-footer {
-  /* TODO: re-enable */
-  display: none;
   width: 100%;
   margin-left: unset;
   background: unset;

diff --git a/ui-tests/test/general.spec.ts b/ui-tests/test/general.spec.ts
@@ -7,10 +7,10 @@ import { expect } from '@playwright/test';
 
 import { test } from './fixtures';
 
-import { waitForKernelReady } from './utils';
+import { hideAddCellButton, waitForKernelReady } from './utils';
 
 test.describe('General', () => {
-  test('The notebook should render', async ({ page, tmpPath }) => {
+  test('The notebook should render', async ({ page, tmpPath, browserName }) => {
     const notebook = 'simple.ipynb';
     await page.contents.uploadFile(
       path.resolve(__dirname, `./notebooks/${notebook}`),
@@ -35,13 +35,19 @@ test.describe('General', () => {
         (element) => (element.innerHTML = 'Last Checkpoint: 3 seconds ago')
       );
 
-    // force switching back to command mode to avoid capturing the cursor in the screenshot
-    await page.evaluate(async () => {
-      await window.jupyterapp.commands.execute('notebook:enter-command-mode');
-    });
+    // check the notebook footer shows up on hover
+    const notebookFooter = '.jp-Notebook-footer';
+    await page.hover(notebookFooter);
+    await page.waitForSelector(notebookFooter);
 
-    // make sure the mouse does not hover on the footer
-    await page.mouse.move(0, 0);
+    // hover somewhere else to make the add cell disappear
+    await page.hover('#jp-top-bar');
+
+    // special case for firefox headless issue
+    // see https://github.com/jupyter/notebook/pull/6872#issuecomment-1549594166 for more details
+    if (browserName === 'firefox') {
+      await hideAddCellButton(page);
+    }
 
     expect(await page.screenshot()).toMatchSnapshot('notebook.png');
   });

diff --git a/ui-tests/test/mobile.spec.ts b/ui-tests/test/mobile.spec.ts
@@ -7,7 +7,7 @@ import { expect } from '@playwright/test';
 
 import { test } from './fixtures';
 
-import { waitForKernelReady } from './utils';
+import { hideAddCellButton, waitForKernelReady } from './utils';
 
 test.use({ autoGoto: false });
 
@@ -30,6 +30,7 @@ test.describe('Mobile', () => {
   test('The layout should be more compact on the notebook page', async ({
     page,
     tmpPath,
+    browserName,
   }) => {
     const notebook = 'empty.ipynb';
     await page.contents.uploadFile(
@@ -50,6 +51,11 @@ test.describe('Mobile', () => {
       await window.jupyterapp.commands.execute('notebook:enter-command-mode');
     });
 
+    // TODO: remove
+    if (browserName === 'firefox') {
+      await hideAddCellButton(page);
+    }
+
     expect(await page.screenshot()).toMatchSnapshot('notebook.png');
   });
 });
diff --git a/ui-tests/test/utils.ts b/ui-tests/test/utils.ts
@@ -34,3 +34,15 @@ export async function waitForKernelReady(
   });
   await page.waitForSelector('.jp-DebuggerBugButton[aria-disabled="false"]');
 }
+
+/**
+ * Special case for firefox headless issue
+ * See https://github.com/jupyter/notebook/pull/6872#issuecomment-1549594166 for more details
+ */
+export async function hideAddCellButton(
+  page: IJupyterLabPageFixture
+): Promise<void> {
+  await page
+    .locator('.jp-Notebook-footer')
+    .evaluate((element) => (element.style.display = 'none'));
+}