Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Tab key does not invoke autocomplete on a new cell until the new cell is re-selected #216

Open
wxirxn-bifrost opened this issue May 13, 2024 · 1 comment
Open

Tab key does not invoke autocomplete on a new cell until the new cell is re-selected #216

wxirxn-bifrost opened this issue May 13, 2024 · 1 comment
Assignees
@echarles
Labels
bug Something isn't working

Comments

@wxirxn-bifrost
Copy link

Description

After creating a new cell, either by running the bottommost cell or manually creating a new cell, pressing Tab while editing on the new cell inserts a tab character instead of invoking the autocomplete widget. However, if I click on another cell, and back to the new cell, the tab key works properly again.

Screen.Recording.2024-05-13.at.3.49.57.PM.mov

In the video, I run the first cell using Shift + Enter. I type "pr", and try to invoke the autocompleter using the Tab key. A tab character is inserted instead (you can see that I try a few times, backspacing the tab character each time). However, after clicking on the first cell, and then clicking onto the new cell again, pressing tab invokes the autocompleter properly.

I also create a third cell by clicking on the button under the bottommost cell, and the same behaviour can be observed - pressing tab inserts a tab character instead of invoking the autocomplete widget, and is only fixed by clicking to another cell, then clicking onto the new cell again.

This behaviour can also be observed on the official jupyter-ui documentation, here and here.

Reproduce

  1. Create a new cell
  2. Begin typing in the new cell
  3. Press Tab to try to invoke the autocomplete widget (it shouldn't work)
  4. Click another cell
  5. Click the new cell once again, and press Tab to invoke the autocomplete widget (it should work now)

Expected behavior

While editing a new cell, pressing tab to invoke the autocomplete widget should work immediately

Context

  • Datalayer version: 0.10.0 (using the Next.js example code)
  • Operating System and version: Windows 11
  • Browser and version: Chrome Version 124.0.6367.63
Browser Output 
app-index.js:33 Warning: JupyterLabCss: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
    at JupyterLabCss (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/lab/JupyterLabCss.js:24:13)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at BaseStyles (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/BaseStyles.js:26:5)
    at Le (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:17336)
    at ThemeProvider (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/ThemeProvider.js:50:3)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/react-error-boundary/dist/react-error-boundary.umd.js:69:37)
    at Jupyter (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/Jupyter.js:45:13)
    at NotebookComponent
    at BailoutToCSR (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/shared/lib/lazy-dynamic/dynamic-bailout-to-csr.js:13:11)
    at Suspense
    at LoadableComponent (Server)
    at Home (Server)
    at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:243:11)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:348:11)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:153:9)
    at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:228:11)
    at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/render-from-template-context.js:16:44)
    at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:369:11)
    at body
    at html
    at RootLayout (Server)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/dev-root-not-found-boundary.js:33:11)
    at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/ReactDevOverlay.js:87:9)
    at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/hot-reloader-client.js:321:11)
    at Router (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:207:11)
    at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:113:9)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:577:13)
    at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:112:27)
    at Root (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:117:11)
window.console.error @ app-index.js:33
Show 1 more frame
Show less
JupyterContext.js:148 Kernel Manager is Ready KernelManager
JupyterContext.js:182 Starting Kernel Name: python
JupyterContext.js:200 Kernel is Ready Kernel
app-index.js:33 Warning: Notebook: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
    at Notebook (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/components/notebook/Notebook.js:45:152)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/react-redux/es/components/Provider.js:13:3)
    at JupyterContextProvider (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/JupyterContext.js:85:13)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at BaseStyles (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/BaseStyles.js:26:5)
    at Le (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:17336)
    at ThemeProvider (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/ThemeProvider.js:50:3)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/react-error-boundary/dist/react-error-boundary.umd.js:69:37)
    at Jupyter (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/Jupyter.js:45:13)
    at NotebookComponent
    at BailoutToCSR (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/shared/lib/lazy-dynamic/dynamic-bailout-to-csr.js:13:11)
    at Suspense
    at LoadableComponent (Server)
    at Home (Server)
    at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:243:11)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:348:11)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:153:9)
    at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:228:11)
    at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/render-from-template-context.js:16:44)
    at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:369:11)
    at body
    at html
    at RootLayout (Server)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/dev-root-not-found-boundary.js:33:11)
    at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/ReactDevOverlay.js:87:9)
    at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/hot-reloader-client.js:321:11)
    at Router (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:207:11)
    at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:113:9)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:577:13)
    at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:112:27)
    at Root (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:117:11)
window.console.error @ app-index.js:33
Show 1 more frame
Show less
app-index.js:33 Warning: Lumino: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.
    at Lumino (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/components/lumino/Lumino.js:20:62)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at div
    at Notebook (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/components/notebook/Notebook.js:45:152)
    at Provider (webpack-internal:///(app-pages-browser)/./node_modules/react-redux/es/components/Provider.js:13:3)
    at JupyterContextProvider (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/JupyterContext.js:85:13)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at div
    at P (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:19658)
    at BaseStyles (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/BaseStyles.js:26:5)
    at Le (webpack-internal:///(app-pages-browser)/./node_modules/styled-components/dist/styled-components.browser.esm.js:30:17336)
    at ThemeProvider (webpack-internal:///(app-pages-browser)/./node_modules/@primer/react/lib-esm/ThemeProvider.js:50:3)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/react-error-boundary/dist/react-error-boundary.umd.js:69:37)
    at Jupyter (webpack-internal:///(app-pages-browser)/./node_modules/@datalayer/jupyter-react/lib/jupyter/Jupyter.js:45:13)
    at NotebookComponent
    at BailoutToCSR (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/shared/lib/lazy-dynamic/dynamic-bailout-to-csr.js:13:11)
    at Suspense
    at LoadableComponent (Server)
    at Home (Server)
    at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:243:11)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:348:11)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:153:9)
    at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:228:11)
    at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/render-from-template-context.js:16:44)
    at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:369:11)
    at body
    at html
    at RootLayout (Server)
    at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:74:9)
    at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:82:11)
    at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:76:9)
    at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:84:11)
    at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/dev-root-not-found-boundary.js:33:11)
    at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/ReactDevOverlay.js:87:9)
    at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/app/hot-reloader-client.js:321:11)
    at Router (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:207:11)
    at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:113:9)
    at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:160:11)
    at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:577:13)
    at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:112:27)
    at Root (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:117:11)
window.console.error @ app-index.js:33
Show 1 more frame
Show less
labicon.js:169 SVG HTML was malformed for LabIcon instance.
name: ui-components:ellipses, svgstr: [object Object]
resolveSvg @ labicon.js:169
Show 1 more frame
Show less
labicon.js:169 SVG HTML was malformed for LabIcon instance.
name: ui-components:ellipses, svgstr: [object Object]
resolveSvg @ labicon.js:169
Show 1 more frame
Show less
Kernel.js:102 Kernel Info Object
NotebookAdapter.js:290 Previous Kernel Connection null
NotebookAdapter.js:292 Current Kernel Connection KernelConnection
app-index.js:33 Comm not found for comm id d6a6a104-3a7b-4570-ad22-231e0d42e85f
window.console.error @ app-index.js:33
Show 1 more frame
Show less
manager-base.js:306 Failed to fetch ipywidgets through the "jupyter.widget.control" comm channel, fallback to fetching individual model state. Reason: Control comm was closed too early
_loadFromKernel @ manager-base.js:306
Show 1 more frame
Show less
@wxirxn-bifrost wxirxn-bifrost added the bug Something isn't working label May 13, 2024
@echarles
Copy link
Member

Thx for reporting. I can reproduce on Next.js and CRA.

@echarles echarles self-assigned this May 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@echarles echarles

Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@echarles @wxirxn-bifrost