Waiting for a (custom) editor to load

[lppedd]

I'm looking for a dynamic wait condition to wait for an editor to be loaded.

More precisely, when you implement a custom editor, VS Code will take a while to load the webview's files on the first open, showing an infinite progress indicator on the line below the tab's name.

I wonder if there is a built-in way to wait for that loading process to end, or if I'll have to invent something by inspecting web elements.

[djelinek]

Hi,
at the moment there is no built-in wait method for a WebVIew content loading. I would suggest to try with some longer maximum timeout for when switching to frame await webview.switchToFrame(10_000); (this will wait more time for iframe is ready in a DOM, if frame is ready but you still need to wait for some other specific content elements then it needs to be implemented separately afterwards)

Best regards,
Dominik

[lppedd]

Hey @djelinek, I've come up with the following condition:

class EditorLoadingCondition extends Condition<boolean> {
  private wait = true;

  constructor(editor: EditorView) {
    super("for the editor to be ready", async (webdriver) => {
      // On the first call, wait for a possible progress indicator to appear.
      // 2 seconds is an arbitrary value decided via trial and error.
      if (this.wait) {
        this.wait = false;
        await webdriver.sleep(2000);
      }

      const progressSelector = By.css("div[class*='monaco-progress-container active']");
      const elements = await editor.findElements(progressSelector);
      return elements.length === 0;
    });
  }
}

Looks good to you?

[djelinek]

looks good to me 🙂 . Most importantly it is working fine for you which is a crucial.