I’m new with web development and i’m trying to do a project on babylon using the gui editor. My code currently works on playground and i adapted it to work on localhost using the tree shaking tutorial, well, to almost work, two methods I’m using: “GUI.AdvancedDynamicTexture.getControlByName(“Name”)” and “GUI.AdvancedDynamicTexture.parseFromURLAsync(“URL”)” are not being recognized, so i went to look at the module that should have those (@babylonjs/gui/2D/AdvancedDynamicTexture ), but there’s nothing on either the js or the ts files, the github file for the gui has those methods, but i don’t know how or if it is possible to put them on my modules. I tried both babylonjs and @babylonjs npm installs and neither have these methods (and many others) on them. Any alternatives for me to use? Should i drop the gui editor for something else? Are those supposed to be playground only methods? I appreciate any help i can get here 
Hello and welcome! 
Show us your package.json please.
Thanks!
here’s the packaje.json, i’m running the code with npx webpack serve, if that makes any difference, the tsconfig and webpack config are the default from the tree shaking tutorial
i had to create an empty ts file on the root for it to work too, for some reason(not my src/index.ts where the scene is located)
{
“name”: “babylonjs”,
“version”: “1.0.0”,
“description”: “A simple NodeJs Express webserver.”,
“main”: “index.ts”,
“scripts”: {
"test": "echo \"Error: no test specified\" && exit 1"
},
“author”: “aWeirdo”,
“license”: “ISC”,
“devDependencies”: {
"@babylonjs/core": "^4.2.1",
"@babylonjs/gui": "^4.2.1",
"@babylonjs/gui-editor": "^5.0.0-alpha.7",
"@babylonjs/materials": "^4.2.1",
"ts-loader": "^9.2.6",
"typescript": "^4.5.5",
"webpack": "^5.68.0",
"webpack-cli": "^4.9.2",
"webpack-dev-server": "^4.7.4"
},
“dependencies”: {
"express": "^4.17.2"
}
}
- first of all an advice when posting here. Enclose pasted code in triple backticks:
It will look like this:
paste code, or json, or whatever that needs to be formatted as code here
- Do you import the
GUInamespace into your project?
Add this to your code:
import * as GUI from '@babylonjs/gui'
so you can use the GUI classes.
- Remove the
"@babylonjs/gui-editor": "^5.0.0-alpha.7",dependency. Just delete the line and run
npm i
in the terminal and let npm to remove the package. It’s not needed. The other issue here is that you can’t mix versions of the babylonjs packages. Always use the same version for all packages.
Let me know what’s the status after you made the proposed changes. 
If you are using the ES6 NPM @babylonjs/* and you are referencing the AdvancedDynamicTexture - it can be imported like:
import { AdvancedDynamicTexture } from '@babylonjs/gui/2D/advancedDynamicTexture'
The default export is there (import * as GUI), but I think that is for legacy purposes. Also, very importantly do not mix versions. You have a 4.2.1 mixed with a 5.0.0-alpha. Would recommend upgrading to latest 5 betas.
No, it is not. The legacy package for the gui is babylonjs-gui. This is a valid import from the es6 gui package.
1.Thanks for the heads up
-
I am importing it as you said, the AdvancedDynamicTexture works fine for most methods, but those two (and some others) are missing from its .ts .js code, i did a fresh npm install on both and still can’t find those methods.
-
I though the gui-editor was a separate module, i tried downloading its module as the parsefromURLAsync is getting a gui-editor json on its URL, but did as you said and removed it(and ran the npm i) and the code still runs the same. I’ll keep in mind the versions of modules on the same folder, but don’t think it was a problem here as the code could run fine if i removed the lines with the missing methods before.
I’m using it as
import * as GUI from '@babylonjs/gui'
the class works fine, its just some methods that i can’t use as its not in its .ts .js code.
The github file for this class here Babylon.js/advancedDynamicTexture.ts at master · BabylonJS/Babylon.js · GitHub has a lot of methods after “moveFocusToControl”
But if i go to my local file in node_modules/@babylonjs/gui/2D/AdvancedDynamicTexture.d.ts in the same part of the code, it skips a lot of methods that ends up a little after the “_Overlaps” method in the github file.
@DanilloCF
I think I know what’s your problem. Those methods are instance methods and not static ones so you have to call them like this, from the instance you have created:
const gui = GUI.AdvancedDynamicTexture.CreateFullscreenUI("gui", true, scene)
gui.getControlByName("name")
GUI.AdvancedDynamicTexture.getControlByName("name") will not work.
I was using let instead of const but the rest was the same as you did, I changed it but still no luck. I think i have to get the right node_module files somewhere else, as a fresh npm install --save-dev @babylon/gui doesn’t have the methods anywhere. Its not only that they don’t work, they’re just not there.
Will you share your code with me in private? I’ll find the issue in a second
The gui package is not a dev dependency. Don’t use the save-dev switch.
That is a typings file, so just a description of the actual file contents. Notice “.d.ts”.
I can´t find the message icon, maybe my account is too new for me to use it, so i’ll be posting the relevant parts of my code here.
import * as BABYLON from '@babylonjs/core';
import * as GUI from '@babylonjs/gui';
const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement; // Get the canvas element
const engine = new BABYLON.Engine(canvas, true); // Generate the BABYLON 3D engine
var createScene = function () {
var scene = new BABYLON.Scene(engine);
const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("GUI", true, scene);
var asyncfunction2 = async function(){
let loadedGUI = await advancedTexture.parseFromURLAsync("URL_I'm_Using");
let scroller = advancedTexture.getControlByName("ScrollViewer");
let sofabutton = advancedTexture.getControlByName("Sofa");
let almofadabutton = advancedTexture.getControlByName("Almofada");
};
return scene
};
there are more things in the async function and after that, but nothing relevant to this problem.
Are you calling this somewhere?
yeah, but the .ts file on github has the same text and some other methods in between the part i said it skipped on the local module. The same can be said to the .js file that is different on my local file compared to the github one. Still, I didn’t know d.ts was a description file.
yeah, everything but the methods parseFromURLAsync() and getControlByName() works fine.
Where are your camera, light and render loop?
I just posted the relevant parts for my problem, all default babylonjs scene variables are on my code and accounted for.
You code looks OK to me then.