replaceSelection only works with timeouts

JupyterLab
,
1

Hello,

I am creating a Jupyterlab extension. My JupyterLab version is: 4.0.5
However, this code only works when using the timeout.

import { NotebookPanel, NotebookActions } from '@jupyterlab/notebook';

export function insert_text_into_notebook(panel: NotebookPanel, position: number, markdown: string) {
    if (panel.content.model?.cells.length === undefined || panel.content.model?.cells.length === 0) {
        console.log("No cells in notebook");
        alert("No cells in notebook");
        return;
    }
    panel.content.activeCellIndex = 0;
    NotebookActions.insertAbove(panel.content);
    panel.content.activeCellIndex = 1;
    NotebookActions.selectAbove(panel.content);
    setTimeout(() => {
        NotebookActions.replaceSelection(panel.content, "### Comment");
    }, 1000);
    panel.content.activeCellIndex = 0;
    NotebookActions.changeCellType(panel.content, "markdown");
}

As soon as I delete the setTimeout, it will not place the text inside the cell. I guess there are some async functions working under the hood which are not immediately ready, however, neither the insertAbove nor selectAbove nor replaceSelection return something like a future or so which would make this easily fixable with an await.

How could I find a better solution? Instead of the timeout? It is my first time working with JavaScript/TypeScript so sorry if I am missing something obvious.

2

Ddoes setTimeout with value of 0 still work?

3

At first glance it seems to work. Now I am even more confused.