Playground snippet menu is broken (CTRL+SPACE)

Tricotou · April 3, 2025, 8:05am

Hello !

I just noticed that the code snippet menu (CTRL+SPACE) on the Playground is broken.

Screencast from 03-04-2025 10:03:54

I have used it a few days ago, so I’m pretty sure it’s a recent change

Cedric · April 3, 2025, 8:52am

cc @RaananW

SimoneDev · April 3, 2025, 9:20am

Additional info:

In Chrome version 134.0.6998.165 (arm64), the helper functions are visible. However, after upgrading to version 135.0.7049.42 (arm64), they no longer appear.

If you open a new “Incognito mode” window, you should see the helper functions even in the latest version. Maybe Chrome caching might affecting the visibility.

Tricotou · April 3, 2025, 9:39am

@SimoneDev you are right pointing out a cache issue. After a forced refresh of Google Chrome, the broken snippet it gone. Either is was indeed cache, either at the same time one of the devs had changed something

RaananW · April 3, 2025, 9:43am

Works for me:

But I am going to continue trying to reproduce, as I a sure both of you have tried refreshing etc’.

Does anyone else experience that? any error in the network/console?

Tricotou · April 3, 2025, 9:49am

Hello Raanan !

Yes sorry, maybe you missed my message just above, but on my side a forced refresh fixed it

Still, I think there is something odd with the Monaco editor cache management, that’s not the first time the editor has something broken until a full refresh. Also, I remember that @roland which is MacOS user had tons of issue with unwanted $ signs on code snippets (Auto TAB jump being broken), I don’t know if it’s still the case

RaananW · April 3, 2025, 9:50am

Sorry, missed that.

Was probably an issue with the typings. Either a bad build/nightly that we missed (which I am going to check, because we shouldn’t) or something temporary on the CDN. I’ll try investigating, I hope to find the reason.

SimoneDev · April 3, 2025, 10:45am

Issue identified! This appears to be an async issue that occurs randomly due to network conditions. However, you can reproduce it consistently by increasing network latency (Chrome Developer Tools > Network > Fast 4G).

When the issue occurs, the following code:

github.com/BabylonJS/Babylon.js

packages/tools/playground/src/tools/monacoManager.ts

master


      
          this._setupDefinitionWorker(libContent);

          

          // Setup the Monaco compilation pipeline, so we can reuse it directly for our scripting needs

          this._setupMonacoCompilationPipeline(libContent);

          

          // This is used for a vscode-like color preview for ColorX types

          this._setupMonacoColorProvider();

          

          if (initialCall) {

              // enhance templates with extra properties

              for (const template of this._templates) {

                  template.kind = monaco.languages.CompletionItemKind.Snippet;

                  template.sortText = "!" + template.label; // make sure templates are on top of the completion window

                  template.insertTextRules = monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet;

              }

          

              this._hookMonacoCompletionProvider();

          }

          

          if (!this.globalState.loadingCodeInProgress) {

              this._setDefaultContent();

is executed before the callback function that populates the this._template:

github.com/BabylonJS/Babylon.js

packages/tools/playground/src/tools/monacoManager.ts

master


      
              insertTextRules: number;

          }[];

          

          private _isDirty = false;

          

          public constructor(public globalState: GlobalState) {

              // First Fetch JSON data for templates code

              this._templates = [];

              this._load(globalState);

              const url = "templates.json?uncacher=" + Date.now();

              fetch(url)

                  .then((response) => response.json())

                  .then((data) => {

                      this._templates = data;

                  });

          }

          

          private _load(globalState: GlobalState) {

              window.addEventListener("beforeunload", (evt) => {

                  if (this._isDirty && Utilities.ReadBoolFromStore("safe-mode", false)) {

                      const message = "Are you sure you want to leave. You have unsaved work.";

ending with the missing helper functions in the array.

Maybe we can move the fetch in setupMonacoAsync function and await its completion before iterating over this._templates.

Tricotou · April 3, 2025, 10:52am

@SimoneDev now that’s a neat bug identification ! Well done !

Are you kidding we can simulate latency in Google Chrome ?
OMG I love you.
I had never looked for such option since I use to have a custom option on my side to simulate latency on my NodeJS servers !

RaananW · April 3, 2025, 1:27pm

Always put it on 3G. Simulate real-life-work-from-tunnel

RaananW · April 3, 2025, 1:27pm

Want to submit a PR? I will be happy to review it and see if it works as expected

SimoneDev · April 3, 2025, 1:48pm

Absolutely! On it!

SimoneDev · April 3, 2025, 3:08pm

Here we are!

github.com/BabylonJS/Babylon.js

Ensure async templates fetch completes before enhancement

master ← simonedevit:async-templates-fetch-before-enhancement

opened 03:07PM - 03 Apr 25 UTC

simonedevit

+14 -13

This PR fixes the random missing of the snippets (helper functions) in the playg…round. Forum discussion: https://forum.babylonjs.com/t/playground-snippet-menu-is-broken-ctrl-space/57593/16. Additional info: - the variable `initialCall` ensures that the templates are not reloaded on language switch - if the templates loading fails, the error is silently handled

RaananW · April 3, 2025, 3:12pm

Approved

Topic		Replies	Views
PG editor templates Bugs	6	55	December 14, 2024
Allow changing Keyboard Shortcuts from the UI Feature requests playground	12	779	July 29, 2022
`CTRL+SPACE` in Playground does not work Questions documentation , tutorial	12	2320	October 23, 2023
Playground editor issue on Android Bugs	3	407	March 31, 2021
In playground selected hint is not visible Bugs	3	357	May 25, 2022

Playground snippet menu is broken (CTRL+SPACE)

Related topics