@onerjs/core 9.0.2 → 9.0.3

package/Materials/Textures/Filtering/hdrIrradianceFiltering.js.map

@@ -1 +1 @@
-{"version":3,"file":"hdrIrradianceFiltering.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/Filtering/hdrIrradianceFiltering.ts"],"names":[],"mappings":"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","sourcesContent":["import { Vector3 } from \"../../../Maths/math\";\r\nimport { ILog2 } from \"../../../Maths/math.scalar.functions\";\r\nimport { BaseTexture } from \"../baseTexture.pure\";\r\nimport { type AbstractEngine } from \"../../../Engines/abstractEngine\";\r\nimport { type Effect } from \"../../../Materials/effect\";\r\nimport { Constants } from \"../../../Engines/constants\";\r\nimport { EffectWrapper, EffectRenderer } from \"../../../Materials/effectRenderer.pure\";\r\nimport { type Nullable } from \"../../../types\";\r\nimport { type RenderTargetWrapper } from \"../../../Engines/renderTargetWrapper\";\r\n\r\nimport { ShaderLanguage } from \"core/Materials/shaderLanguage\";\r\nimport { IblCdfGenerator } from \"../../../Rendering/iblCdfGenerator\";\r\n\r\n/**\r\n * Options for texture filtering\r\n */\r\ninterface IHDRIrradianceFilteringOptions {\r\n    /**\r\n     * Scales pixel intensity for the input HDR map.\r\n     */\r\n    hdrScale?: number;\r\n\r\n    /**\r\n     * Quality of the filter. Should be `Constants.TEXTURE_FILTERING_QUALITY_OFFLINE` for prefiltering\r\n     */\r\n    quality?: number;\r\n\r\n    /**\r\n     * Use the Cumulative Distribution Function (CDF) for filtering\r\n     */\r\n    useCdf?: boolean;\r\n}\r\n\r\n/**\r\n * Filters HDR maps to get correct renderings of PBR reflections\r\n */\r\nexport class HDRIrradianceFiltering {\r\n    private _engine: AbstractEngine;\r\n    private _effectRenderer: EffectRenderer;\r\n    private _effectWrapper: EffectWrapper;\r\n    private _cdfGenerator: IblCdfGenerator;\r\n\r\n    /**\r\n     * Quality switch for prefiltering. Should be set to `Constants.TEXTURE_FILTERING_QUALITY_OFFLINE` unless\r\n     * you care about baking speed.\r\n     */\r\n    public quality: number = Constants.TEXTURE_FILTERING_QUALITY_OFFLINE;\r\n\r\n    /**\r\n     * Scales pixel intensity for the input HDR map.\r\n     */\r\n    public hdrScale: number = 1;\r\n\r\n    /**\r\n     * Use the Cumulative Distribution Function (CDF) for filtering\r\n     */\r\n    public useCdf: boolean = false;\r\n\r\n    /**\r\n     * Instantiates HDR filter for irradiance map\r\n     *\r\n     * @param engine Thin engine\r\n     * @param options Options\r\n     */\r\n    constructor(engine: AbstractEngine, options: IHDRIrradianceFilteringOptions = {}) {\r\n        // pass\r\n        this._engine = engine;\r\n        this.hdrScale = options.hdrScale || this.hdrScale;\r\n        this.quality = options.quality || this.quality;\r\n        this.useCdf = options.useCdf || this.useCdf;\r\n    }\r\n\r\n    private _createRenderTarget(size: number): RenderTargetWrapper {\r\n        let textureType = Constants.TEXTURETYPE_UNSIGNED_BYTE;\r\n        if (this._engine.getCaps().textureHalfFloatRender) {\r\n            textureType = Constants.TEXTURETYPE_HALF_FLOAT;\r\n        } else if (this._engine.getCaps().textureFloatRender) {\r\n            textureType = Constants.TEXTURETYPE_FLOAT;\r\n        }\r\n\r\n        const rtWrapper = this._engine.createRenderTargetCubeTexture(size, {\r\n            format: Constants.TEXTUREFORMAT_RGBA,\r\n            type: textureType,\r\n            createMipMaps: false,\r\n            generateMipMaps: false,\r\n            generateDepthBuffer: false,\r\n            generateStencilBuffer: false,\r\n            samplingMode: Constants.TEXTURE_BILINEAR_SAMPLINGMODE,\r\n            label: \"HDR_Irradiance_Filtering_Target\",\r\n        });\r\n        this._engine.updateTextureWrappingMode(rtWrapper.texture!, Constants.TEXTURE_CLAMP_ADDRESSMODE, Constants.TEXTURE_CLAMP_ADDRESSMODE, Constants.TEXTURE_CLAMP_ADDRESSMODE);\r\n\r\n        return rtWrapper;\r\n    }\r\n\r\n    private _prefilterInternal(texture: BaseTexture): BaseTexture {\r\n        const width = texture.getSize().width;\r\n        const mipmapsCount = ILog2(width);\r\n\r\n        const effect = this._effectWrapper.effect;\r\n        if (!effect) {\r\n            return texture;\r\n        }\r\n        // Choose a power of 2 size for the irradiance map.\r\n        // It can be much smaller than the original texture.\r\n        const irradianceSize = Math.max(32, 1 << ILog2(width >> 3));\r\n        const outputTexture = this._createRenderTarget(irradianceSize);\r\n        this._effectRenderer.saveStates();\r\n        this._effectRenderer.setViewport();\r\n\r\n        this._effectRenderer.applyEffectWrapper(this._effectWrapper);\r\n\r\n        const directions = [\r\n            [new Vector3(0, 0, -1), new Vector3(0, -1, 0), new Vector3(1, 0, 0)], // PositiveX\r\n            [new Vector3(0, 0, 1), new Vector3(0, -1, 0), new Vector3(-1, 0, 0)], // NegativeX\r\n            [new Vector3(1, 0, 0), new Vector3(0, 0, 1), new Vector3(0, 1, 0)], // PositiveY\r\n            [new Vector3(1, 0, 0), new Vector3(0, 0, -1), new Vector3(0, -1, 0)], // NegativeY\r\n            [new Vector3(1, 0, 0), new Vector3(0, -1, 0), new Vector3(0, 0, 1)], // PositiveZ\r\n            [new Vector3(-1, 0, 0), new Vector3(0, -1, 0), new Vector3(0, 0, -1)], // NegativeZ\r\n        ];\r\n\r\n        effect.setFloat(\"hdrScale\", this.hdrScale);\r\n        effect.setFloat2(\"vFilteringInfo\", texture.getSize().width, mipmapsCount);\r\n        effect.setTexture(\"inputTexture\", texture);\r\n        if (this._cdfGenerator) {\r\n            effect.setTexture(\"icdfTexture\", this._cdfGenerator.getIcdfTexture());\r\n        }\r\n\r\n        for (let face = 0; face < 6; face++) {\r\n            effect.setVector3(\"up\", directions[face][0]);\r\n            effect.setVector3(\"right\", directions[face][1]);\r\n            effect.setVector3(\"front\", directions[face][2]);\r\n\r\n            this._engine.bindFramebuffer(outputTexture, face, undefined, undefined, true);\r\n            this._effectRenderer.applyEffectWrapper(this._effectWrapper);\r\n\r\n            this._effectRenderer.draw();\r\n        }\r\n\r\n        // Cleanup\r\n        this._effectRenderer.restoreStates();\r\n        this._engine.restoreDefaultFramebuffer();\r\n        effect.setTexture(\"inputTexture\", null);\r\n        effect.setTexture(\"icdfTexture\", null);\r\n        const irradianceTexture = new BaseTexture(texture.getScene(), outputTexture.texture);\r\n        irradianceTexture.name = texture.name + \"_irradiance\";\r\n        irradianceTexture.displayName = texture.name + \"_irradiance\";\r\n        irradianceTexture.gammaSpace = false;\r\n        return irradianceTexture;\r\n    }\r\n\r\n    private _createEffect(texture: BaseTexture, onCompiled?: Nullable<(effect: Effect) => void>): EffectWrapper {\r\n        const defines = [];\r\n        if (texture.gammaSpace) {\r\n            defines.push(\"#define GAMMA_INPUT\");\r\n        }\r\n\r\n        defines.push(\"#define NUM_SAMPLES \" + this.quality + \"u\"); // unsigned int\r\n\r\n        const isWebGPU = this._engine.isWebGPU;\r\n        const samplers = [\"inputTexture\"];\r\n        if (this._cdfGenerator) {\r\n            samplers.push(\"icdfTexture\");\r\n            defines.push(\"#define IBL_CDF_FILTERING\");\r\n        }\r\n        const effectWrapper = new EffectWrapper({\r\n            engine: this._engine,\r\n            name: \"HDRIrradianceFiltering\",\r\n            vertexShader: \"hdrIrradianceFiltering\",\r\n            fragmentShader: \"hdrIrradianceFiltering\",\r\n            samplerNames: samplers,\r\n            uniformNames: [\"vSampleDirections\", \"vWeights\", \"up\", \"right\", \"front\", \"vFilteringInfo\", \"hdrScale\"],\r\n            useShaderStore: true,\r\n            defines,\r\n            onCompiled: onCompiled,\r\n            shaderLanguage: isWebGPU ? ShaderLanguage.WGSL : ShaderLanguage.GLSL,\r\n            extraInitializationsAsync: async () => {\r\n                if (isWebGPU) {\r\n                    await Promise.all([import(\"../../../ShadersWGSL/hdrIrradianceFiltering.vertex\"), import(\"../../../ShadersWGSL/hdrIrradianceFiltering.fragment\")]);\r\n                } else {\r\n                    await Promise.all([import(\"../../../Shaders/hdrIrradianceFiltering.vertex\"), import(\"../../../Shaders/hdrIrradianceFiltering.fragment\")]);\r\n                }\r\n            },\r\n        });\r\n\r\n        return effectWrapper;\r\n    }\r\n\r\n    /**\r\n     * Get a value indicating if the filter is ready to be used\r\n     * @param texture Texture to filter\r\n     * @returns true if the filter is ready\r\n     */\r\n    public isReady(texture: BaseTexture) {\r\n        return texture.isReady() && this._effectWrapper.effect.isReady();\r\n    }\r\n\r\n    /**\r\n     * Prefilters a cube texture to contain IBL irradiance.\r\n     * Prefiltering will be invoked at the end of next rendering pass.\r\n     * This has to be done once the map is loaded, and has not been prefiltered by a third party software.\r\n     * See http://blog.selfshadow.com/publications/s2013-shading-course/karis/s2013_pbs_epic_notes_v2.pdf for more information\r\n     * @param texture Texture to filter\r\n     * @returns Promise called when prefiltering is done\r\n     */\r\n    // eslint-disable-next-line @typescript-eslint/naming-convention\r\n    public async prefilter(texture: BaseTexture): Promise<BaseTexture> {\r\n        if (!this._engine._features.allowTexturePrefiltering) {\r\n            throw new Error(\"HDR prefiltering is not available in WebGL 1., you can use real time filtering instead.\");\r\n        }\r\n\r\n        if (this.useCdf) {\r\n            this._cdfGenerator = new IblCdfGenerator(this._engine);\r\n            this._cdfGenerator.iblSource = texture;\r\n\r\n            await this._cdfGenerator.renderWhenReady();\r\n        }\r\n\r\n        this._effectRenderer = new EffectRenderer(this._engine);\r\n        this._effectWrapper = this._createEffect(texture);\r\n        await this._effectWrapper.effect.whenCompiledAsync();\r\n\r\n        const irradianceTexture = this._prefilterInternal(texture);\r\n\r\n        if (this.useCdf) {\r\n            // eslint-disable-next-line github/no-then\r\n            await this._cdfGenerator.findDominantDirection().then((dir) => {\r\n                irradianceTexture._dominantDirection = dir;\r\n            });\r\n        }\r\n        this._effectRenderer.dispose();\r\n        this._effectWrapper.dispose();\r\n        this._cdfGenerator?.dispose();\r\n\r\n        return irradianceTexture;\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"hdrIrradianceFiltering.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/Filtering/hdrIrradianceFiltering.ts"],"names":[],"mappings":"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","sourcesContent":["import { Vector3 } from \"../../../Maths/math\";\r\nimport { ILog2 } from \"../../../Maths/math.scalar.functions\";\r\nimport { BaseTexture } from \"../baseTexture.pure\";\r\nimport { type AbstractEngine } from \"../../../Engines/abstractEngine\";\r\nimport { type Effect } from \"../../../Materials/effect\";\r\nimport { Constants } from \"../../../Engines/constants\";\r\nimport { EffectWrapper, EffectRenderer } from \"../../../Materials/effectRenderer.pure\";\r\nimport { type Nullable } from \"../../../types\";\r\nimport { type RenderTargetWrapper } from \"../../../Engines/renderTargetWrapper\";\r\nimport { type InternalTexture } from \"../internalTexture\";\r\n\r\nimport { ShaderLanguage } from \"core/Materials/shaderLanguage\";\r\nimport { IblCdfGenerator } from \"../../../Rendering/iblCdfGenerator\";\r\n\r\n/**\r\n * Options for texture filtering\r\n */\r\ninterface IHDRIrradianceFilteringOptions {\r\n    /**\r\n     * Scales pixel intensity for the input HDR map.\r\n     */\r\n    hdrScale?: number;\r\n\r\n    /**\r\n     * Quality of the filter. Should be `Constants.TEXTURE_FILTERING_QUALITY_OFFLINE` for prefiltering\r\n     */\r\n    quality?: number;\r\n\r\n    /**\r\n     * Use the Cumulative Distribution Function (CDF) for filtering\r\n     */\r\n    useCdf?: boolean;\r\n}\r\n\r\n/**\r\n * Filters HDR maps to get correct renderings of PBR reflections\r\n */\r\nexport class HDRIrradianceFiltering {\r\n    private _engine: AbstractEngine;\r\n    private _effectRenderer: EffectRenderer;\r\n    private _effectWrapper: EffectWrapper;\r\n    private _cdfGenerator: IblCdfGenerator;\r\n\r\n    /**\r\n     * Quality switch for prefiltering. Should be set to `Constants.TEXTURE_FILTERING_QUALITY_OFFLINE` unless\r\n     * you care about baking speed.\r\n     */\r\n    public quality: number = Constants.TEXTURE_FILTERING_QUALITY_OFFLINE;\r\n\r\n    /**\r\n     * Scales pixel intensity for the input HDR map.\r\n     */\r\n    public hdrScale: number = 1;\r\n\r\n    /**\r\n     * Use the Cumulative Distribution Function (CDF) for filtering\r\n     */\r\n    public useCdf: boolean = false;\r\n\r\n    /**\r\n     * Instantiates HDR filter for irradiance map\r\n     *\r\n     * @param engine Thin engine\r\n     * @param options Options\r\n     */\r\n    constructor(engine: AbstractEngine, options: IHDRIrradianceFilteringOptions = {}) {\r\n        // pass\r\n        this._engine = engine;\r\n        this.hdrScale = options.hdrScale || this.hdrScale;\r\n        this.quality = options.quality || this.quality;\r\n        this.useCdf = options.useCdf || this.useCdf;\r\n    }\r\n\r\n    private _createRenderTarget(size: number): RenderTargetWrapper {\r\n        let textureType = Constants.TEXTURETYPE_UNSIGNED_BYTE;\r\n        if (this._engine.getCaps().textureHalfFloatRender) {\r\n            textureType = Constants.TEXTURETYPE_HALF_FLOAT;\r\n        } else if (this._engine.getCaps().textureFloatRender) {\r\n            textureType = Constants.TEXTURETYPE_FLOAT;\r\n        }\r\n\r\n        const rtWrapper = this._engine.createRenderTargetCubeTexture(size, {\r\n            format: Constants.TEXTUREFORMAT_RGBA,\r\n            type: textureType,\r\n            createMipMaps: false,\r\n            generateMipMaps: false,\r\n            generateDepthBuffer: false,\r\n            generateStencilBuffer: false,\r\n            samplingMode: Constants.TEXTURE_BILINEAR_SAMPLINGMODE,\r\n            label: \"HDR_Irradiance_Filtering_Target\",\r\n        });\r\n        this._engine.updateTextureWrappingMode(rtWrapper.texture!, Constants.TEXTURE_CLAMP_ADDRESSMODE, Constants.TEXTURE_CLAMP_ADDRESSMODE, Constants.TEXTURE_CLAMP_ADDRESSMODE);\r\n\r\n        return rtWrapper;\r\n    }\r\n\r\n    private _rebuildRenderTargetStorage(size: number): { proxy: InternalTexture; isReady: boolean; isAsync: boolean } {\r\n        const rtWrapper = this._createRenderTarget(size);\r\n        const proxy = rtWrapper.texture!;\r\n        rtWrapper.dispose(true);\r\n        return { proxy, isReady: true, isAsync: false };\r\n    }\r\n\r\n    private _prefilterInternal(texture: BaseTexture): BaseTexture {\r\n        const width = texture.getSize().width;\r\n        const mipmapsCount = ILog2(width);\r\n\r\n        const effect = this._effectWrapper.effect;\r\n        if (!effect) {\r\n            return texture;\r\n        }\r\n        // Choose a power of 2 size for the irradiance map.\r\n        // It can be much smaller than the original texture.\r\n        const irradianceSize = Math.max(32, 1 << ILog2(width >> 3));\r\n        const outputTexture = this._createRenderTarget(irradianceSize);\r\n        this._effectRenderer.saveStates();\r\n        this._effectRenderer.setViewport();\r\n\r\n        this._effectRenderer.applyEffectWrapper(this._effectWrapper);\r\n\r\n        const directions = [\r\n            [new Vector3(0, 0, -1), new Vector3(0, -1, 0), new Vector3(1, 0, 0)], // PositiveX\r\n            [new Vector3(0, 0, 1), new Vector3(0, -1, 0), new Vector3(-1, 0, 0)], // NegativeX\r\n            [new Vector3(1, 0, 0), new Vector3(0, 0, 1), new Vector3(0, 1, 0)], // PositiveY\r\n            [new Vector3(1, 0, 0), new Vector3(0, 0, -1), new Vector3(0, -1, 0)], // NegativeY\r\n            [new Vector3(1, 0, 0), new Vector3(0, -1, 0), new Vector3(0, 0, 1)], // PositiveZ\r\n            [new Vector3(-1, 0, 0), new Vector3(0, -1, 0), new Vector3(0, 0, -1)], // NegativeZ\r\n        ];\r\n\r\n        effect.setFloat(\"hdrScale\", this.hdrScale);\r\n        effect.setFloat2(\"vFilteringInfo\", texture.getSize().width, mipmapsCount);\r\n        effect.setTexture(\"inputTexture\", texture);\r\n        if (this._cdfGenerator) {\r\n            effect.setTexture(\"icdfTexture\", this._cdfGenerator.getIcdfTexture());\r\n        }\r\n\r\n        for (let face = 0; face < 6; face++) {\r\n            effect.setVector3(\"up\", directions[face][0]);\r\n            effect.setVector3(\"right\", directions[face][1]);\r\n            effect.setVector3(\"front\", directions[face][2]);\r\n\r\n            this._engine.bindFramebuffer(outputTexture, face, undefined, undefined, true);\r\n            this._effectRenderer.applyEffectWrapper(this._effectWrapper);\r\n\r\n            this._effectRenderer.draw();\r\n        }\r\n\r\n        // Cleanup\r\n        this._effectRenderer.restoreStates();\r\n        this._engine.restoreDefaultFramebuffer();\r\n        effect.setTexture(\"inputTexture\", null);\r\n        effect.setTexture(\"icdfTexture\", null);\r\n        const irradianceTexture = new BaseTexture(texture.getScene(), outputTexture.texture);\r\n        // The returned texture now owns the internal texture; only the framebuffers need releasing.\r\n        // That also drops the wrapper from the engine's restore cache, so recreate the storage on context restore.\r\n        outputTexture.texture!.onRebuildCallback = () => this._rebuildRenderTargetStorage(irradianceSize);\r\n        outputTexture.dispose(true);\r\n        irradianceTexture.name = texture.name + \"_irradiance\";\r\n        irradianceTexture.displayName = texture.name + \"_irradiance\";\r\n        irradianceTexture.gammaSpace = false;\r\n        return irradianceTexture;\r\n    }\r\n\r\n    private _createEffect(texture: BaseTexture, onCompiled?: Nullable<(effect: Effect) => void>): EffectWrapper {\r\n        const defines = [];\r\n        if (texture.gammaSpace) {\r\n            defines.push(\"#define GAMMA_INPUT\");\r\n        }\r\n\r\n        defines.push(\"#define NUM_SAMPLES \" + this.quality + \"u\"); // unsigned int\r\n\r\n        const isWebGPU = this._engine.isWebGPU;\r\n        const samplers = [\"inputTexture\"];\r\n        if (this._cdfGenerator) {\r\n            samplers.push(\"icdfTexture\");\r\n            defines.push(\"#define IBL_CDF_FILTERING\");\r\n        }\r\n        const effectWrapper = new EffectWrapper({\r\n            engine: this._engine,\r\n            name: \"HDRIrradianceFiltering\",\r\n            vertexShader: \"hdrIrradianceFiltering\",\r\n            fragmentShader: \"hdrIrradianceFiltering\",\r\n            samplerNames: samplers,\r\n            uniformNames: [\"vSampleDirections\", \"vWeights\", \"up\", \"right\", \"front\", \"vFilteringInfo\", \"hdrScale\"],\r\n            useShaderStore: true,\r\n            defines,\r\n            onCompiled: onCompiled,\r\n            shaderLanguage: isWebGPU ? ShaderLanguage.WGSL : ShaderLanguage.GLSL,\r\n            extraInitializationsAsync: async () => {\r\n                if (isWebGPU) {\r\n                    await Promise.all([import(\"../../../ShadersWGSL/hdrIrradianceFiltering.vertex\"), import(\"../../../ShadersWGSL/hdrIrradianceFiltering.fragment\")]);\r\n                } else {\r\n                    await Promise.all([import(\"../../../Shaders/hdrIrradianceFiltering.vertex\"), import(\"../../../Shaders/hdrIrradianceFiltering.fragment\")]);\r\n                }\r\n            },\r\n        });\r\n\r\n        return effectWrapper;\r\n    }\r\n\r\n    /**\r\n     * Get a value indicating if the filter is ready to be used\r\n     * @param texture Texture to filter\r\n     * @returns true if the filter is ready\r\n     */\r\n    public isReady(texture: BaseTexture) {\r\n        return texture.isReady() && this._effectWrapper.effect.isReady();\r\n    }\r\n\r\n    /**\r\n     * Prefilters a cube texture to contain IBL irradiance.\r\n     * Prefiltering will be invoked at the end of next rendering pass.\r\n     * This has to be done once the map is loaded, and has not been prefiltered by a third party software.\r\n     * See http://blog.selfshadow.com/publications/s2013-shading-course/karis/s2013_pbs_epic_notes_v2.pdf for more information\r\n     * @param texture Texture to filter\r\n     * @returns Promise called when prefiltering is done\r\n     */\r\n    // eslint-disable-next-line @typescript-eslint/naming-convention\r\n    public async prefilter(texture: BaseTexture): Promise<BaseTexture> {\r\n        if (!this._engine._features.allowTexturePrefiltering) {\r\n            throw new Error(\"HDR prefiltering is not available in WebGL 1., you can use real time filtering instead.\");\r\n        }\r\n\r\n        if (this.useCdf) {\r\n            this._cdfGenerator = new IblCdfGenerator(this._engine);\r\n            this._cdfGenerator.iblSource = texture;\r\n\r\n            await this._cdfGenerator.renderWhenReady();\r\n        }\r\n\r\n        this._effectRenderer = new EffectRenderer(this._engine);\r\n        this._effectWrapper = this._createEffect(texture);\r\n        await this._effectWrapper.effect.whenCompiledAsync();\r\n\r\n        const irradianceTexture = this._prefilterInternal(texture);\r\n\r\n        if (this.useCdf) {\r\n            // eslint-disable-next-line github/no-then\r\n            await this._cdfGenerator.findDominantDirection().then((dir) => {\r\n                irradianceTexture._dominantDirection = dir;\r\n            });\r\n        }\r\n        this._effectRenderer.dispose();\r\n        this._effectWrapper.dispose();\r\n        this._cdfGenerator?.dispose();\r\n\r\n        return irradianceTexture;\r\n    }\r\n}\r\n"]}

package/Materials/Textures/HTML/htmlInCanvasPolyfill.d.ts

@@ -21,6 +21,11 @@ export interface IInstallHtmlInCanvasPolyfillOptions {
     /** A pre-imported polyfill module to use instead of dynamically importing one. */
     polyfillModule?: IHtmlInCanvasPolyfillModule;
 }
+/**
+ * Tracks the installer-owned polyfill so consumers use its legacy snapshot APIs even when newer native APIs remain exposed.
+ * @internal
+ */
+export declare function _IsHtmlInCanvasPolyfillInstalled(): boolean;
 /**
  * Detects whether the browser supports the WICG HTML-in-Canvas API natively (or already has it installed).
  * @returns true when an HTMLCanvasElement exposes `captureElementImage`

package/Materials/Textures/HTML/htmlInCanvasPolyfill.js

@@ -1,6 +1,13 @@
 /** This module has no top-level side effects: it only declares the optional HTML-in-Canvas polyfill installer */
 import { Logger } from "../../../Misc/logger.js";
 let _InstalledModule = null;
+/**
+ * Tracks the installer-owned polyfill so consumers use its legacy snapshot APIs even when newer native APIs remain exposed.
+ * @internal
+ */
+export function _IsHtmlInCanvasPolyfillInstalled() {
+    return _InstalledModule !== null;
+}
 /**
  * Detects whether the browser supports the WICG HTML-in-Canvas API natively (or already has it installed).
  * @returns true when an HTMLCanvasElement exposes `captureElementImage`

package/Materials/Textures/HTML/htmlInCanvasPolyfill.js.map

@@ -1 +1 @@
-{"version":3,"file":"htmlInCanvasPolyfill.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/HTML/htmlInCanvasPolyfill.ts"],"names":[],"mappings":"AAAA,iHAAiH;AAGjH,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AA2B9C,IAAI,gBAAgB,GAA0C,IAAI,CAAC;AAEnE;;;GAGG;AACH,MAAM,UAAU,+BAA+B;IAC3C,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,CAAC;QAClC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAA0D,CAAC;IACzG,OAAO,OAAO,MAAM,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAC5D,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,CAAC,KAAK,UAAU,2BAA2B,CAAC,UAA+C,EAAE;IAC/F,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,mBAAmB,EAAE,CAAC;IAErD,IAAI,CAAC,KAAK,IAAI,+BAA+B,EAAE,EAAE,CAAC;QAC9C,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,MAAM,MAAM,GAAG,OAAO,CAAC,cAAc,IAAI,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC,eAAe,IAAI,mBAAmB,CAAC,CAAC,CAAC;IACjH,IAAI,CAAC,MAAM,IAAI,OAAO,MAAM,CAAC,2BAA2B,KAAK,UAAU,EAAE,CAAC;QACtE,MAAM,CAAC,IAAI,CAAC,yGAAyG,CAAC,CAAC;QACvH,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,MAAM,CAAC,2BAA2B,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IACxE,gBAAgB,GAAG,MAAM,CAAC;IAC1B,OAAO,IAAI,CAAC;AAChB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,6BAA6B;IACzC,IAAI,gBAAgB,IAAI,OAAO,gBAAgB,CAAC,6BAA6B,KAAK,UAAU,EAAE,CAAC;QAC3F,gBAAgB,CAAC,6BAA6B,EAAE,CAAC;IACrD,CAAC;IACD,gBAAgB,GAAG,IAAI,CAAC;AAC5B,CAAC;AAED,KAAK,UAAU,eAAe,CAAC,SAAiB;IAC5C,IAAI,CAAC;QACD,qGAAqG;QACrG,gGAAgG;QAChG,oGAAoG;QACpG,sDAAsD;QACtD,OAAO,CAAC,MAAM,MAAM,CAAC,kBAAkB,CAAC,yBAAyB,CAAC,SAAS,CAAC,CAAgC,CAAC;IACjH,CAAC;IAAC,MAAM,CAAC;QACL,MAAM,CAAC,IAAI,CAAC,mDAAmD,SAAS,wDAAwD,CAAC,CAAC;QAClI,OAAO,IAAI,CAAC;IAChB,CAAC;AACL,CAAC;AAED,SAAS,mBAAmB;IACxB,OAAO,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,CAAC,MAAM,CAAC,QAAQ,IAAI,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AACnH,CAAC","sourcesContent":["/** This module has no top-level side effects: it only declares the optional HTML-in-Canvas polyfill installer */\n\nimport { type Nullable } from \"../../../types\";\nimport { Logger } from \"../../../Misc/logger\";\n\n// Attribution: the WICG HTML-in-Canvas polyfill is `three-html-render` by Palash Bansal (`repalash`),\n// MIT. It is consumed as an optional, lazily-imported dependency and is never bundled into Babylon.\n\n/**\n * Shape of the `three-html-render` polyfill module (only the parts this wrapper uses).\n */\nexport interface IHtmlInCanvasPolyfillModule {\n    /** Installs the WICG HTML-in-Canvas polyfill onto the relevant DOM prototypes. */\n    installHtmlInCanvasPolyfill?: (options?: { force?: boolean }) => void;\n    /** Removes a previously installed polyfill. */\n    uninstallHtmlInCanvasPolyfill?: () => void;\n}\n\n/**\n * Options for {@link InstallHtmlInCanvasPolyfill}.\n */\nexport interface IInstallHtmlInCanvasPolyfillOptions {\n    /** Install the polyfill even when the browser already supports the API natively (default false). */\n    force?: boolean;\n    /** Module specifier to lazily import the polyfill from (default `\"three-html-render\"`). */\n    moduleSpecifier?: string;\n    /** A pre-imported polyfill module to use instead of dynamically importing one. */\n    polyfillModule?: IHtmlInCanvasPolyfillModule;\n}\n\nlet _InstalledModule: Nullable<IHtmlInCanvasPolyfillModule> = null;\n\n/**\n * Detects whether the browser supports the WICG HTML-in-Canvas API natively (or already has it installed).\n * @returns true when an HTMLCanvasElement exposes `captureElementImage`\n */\nexport function IsHtmlInCanvasSupportedNatively(): boolean {\n    if (typeof document === \"undefined\") {\n        return false;\n    }\n    const canvas = document.createElement(\"canvas\") as HTMLCanvasElement & { captureElementImage?: unknown };\n    return typeof canvas.captureElementImage === \"function\";\n}\n\n/**\n * Lazily installs the WICG HTML-in-Canvas polyfill (`three-html-render`) so that {@link HtmlTexture} and the\n * interaction managers work in browsers that do not yet ship the native API.\n *\n * The polyfill is an optional dependency: it is imported on demand and never bundled into Babylon. When the\n * browser already supports the API natively, this is a no-op unless `force` is set or the `?polyfillHIC` URL\n * flag is present.\n * @param options optional installation configuration\n * @returns a promise that resolves to true when the polyfill was installed, false otherwise\n */\nexport async function InstallHtmlInCanvasPolyfill(options: IInstallHtmlInCanvasPolyfillOptions = {}): Promise<boolean> {\n    const force = options.force ?? _HasPolyfillUrlFlag();\n\n    if (!force && IsHtmlInCanvasSupportedNatively()) {\n        return false;\n    }\n\n    const module = options.polyfillModule ?? (await _ImportPolyfill(options.moduleSpecifier ?? \"three-html-render\"));\n    if (!module || typeof module.installHtmlInCanvasPolyfill !== \"function\") {\n        Logger.Warn(\"HTML-in-Canvas: the polyfill module does not expose installHtmlInCanvasPolyfill; nothing was installed.\");\n        return false;\n    }\n\n    module.installHtmlInCanvasPolyfill(force ? { force: true } : undefined);\n    _InstalledModule = module;\n    return true;\n}\n\n/**\n * Removes a polyfill previously installed by {@link InstallHtmlInCanvasPolyfill}.\n */\nexport function UninstallHtmlInCanvasPolyfill(): void {\n    if (_InstalledModule && typeof _InstalledModule.uninstallHtmlInCanvasPolyfill === \"function\") {\n        _InstalledModule.uninstallHtmlInCanvasPolyfill();\n    }\n    _InstalledModule = null;\n}\n\nasync function _ImportPolyfill(specifier: string): Promise<Nullable<IHtmlInCanvasPolyfillModule>> {\n    try {\n        // The specifier is a variable so bundlers leave this as a runtime import and the optional package is\n        // not required to be installed at build time. The UMD/global build cannot resolve a bare module\n        // specifier, so this dynamic import is neutralized there (see rewriteDynamicExternalImportsPlugin);\n        // UMD consumers should pass `polyfillModule` instead.\n        return (await import(/* @vite-ignore */ /* webpackIgnore: true */ specifier)) as IHtmlInCanvasPolyfillModule;\n    } catch {\n        Logger.Warn(`HTML-in-Canvas: could not load polyfill module \"${specifier}\". Install three-html-render or pass a polyfillModule.`);\n        return null;\n    }\n}\n\nfunction _HasPolyfillUrlFlag(): boolean {\n    return typeof window !== \"undefined\" && !!window.location && /[?&]polyfillHIC\\b/i.test(window.location.search);\n}\n"]}
+{"version":3,"file":"htmlInCanvasPolyfill.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/HTML/htmlInCanvasPolyfill.ts"],"names":[],"mappings":"AAAA,iHAAiH;AAGjH,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AA2B9C,IAAI,gBAAgB,GAA0C,IAAI,CAAC;AAEnE;;;GAGG;AACH,MAAM,UAAU,gCAAgC;IAC5C,OAAO,gBAAgB,KAAK,IAAI,CAAC;AACrC,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,+BAA+B;IAC3C,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,CAAC;QAClC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAA0D,CAAC;IACzG,OAAO,OAAO,MAAM,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAC5D,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,CAAC,KAAK,UAAU,2BAA2B,CAAC,UAA+C,EAAE;IAC/F,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,mBAAmB,EAAE,CAAC;IAErD,IAAI,CAAC,KAAK,IAAI,+BAA+B,EAAE,EAAE,CAAC;QAC9C,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,MAAM,MAAM,GAAG,OAAO,CAAC,cAAc,IAAI,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC,eAAe,IAAI,mBAAmB,CAAC,CAAC,CAAC;IACjH,IAAI,CAAC,MAAM,IAAI,OAAO,MAAM,CAAC,2BAA2B,KAAK,UAAU,EAAE,CAAC;QACtE,MAAM,CAAC,IAAI,CAAC,yGAAyG,CAAC,CAAC;QACvH,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,MAAM,CAAC,2BAA2B,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IACxE,gBAAgB,GAAG,MAAM,CAAC;IAC1B,OAAO,IAAI,CAAC;AAChB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,6BAA6B;IACzC,IAAI,gBAAgB,IAAI,OAAO,gBAAgB,CAAC,6BAA6B,KAAK,UAAU,EAAE,CAAC;QAC3F,gBAAgB,CAAC,6BAA6B,EAAE,CAAC;IACrD,CAAC;IACD,gBAAgB,GAAG,IAAI,CAAC;AAC5B,CAAC;AAED,KAAK,UAAU,eAAe,CAAC,SAAiB;IAC5C,IAAI,CAAC;QACD,qGAAqG;QACrG,gGAAgG;QAChG,oGAAoG;QACpG,sDAAsD;QACtD,OAAO,CAAC,MAAM,MAAM,CAAC,kBAAkB,CAAC,yBAAyB,CAAC,SAAS,CAAC,CAAgC,CAAC;IACjH,CAAC;IAAC,MAAM,CAAC;QACL,MAAM,CAAC,IAAI,CAAC,mDAAmD,SAAS,wDAAwD,CAAC,CAAC;QAClI,OAAO,IAAI,CAAC;IAChB,CAAC;AACL,CAAC;AAED,SAAS,mBAAmB;IACxB,OAAO,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,CAAC,MAAM,CAAC,QAAQ,IAAI,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AACnH,CAAC","sourcesContent":["/** This module has no top-level side effects: it only declares the optional HTML-in-Canvas polyfill installer */\n\nimport { type Nullable } from \"../../../types\";\nimport { Logger } from \"../../../Misc/logger\";\n\n// Attribution: the WICG HTML-in-Canvas polyfill is `three-html-render` by Palash Bansal (`repalash`),\n// MIT. It is consumed as an optional, lazily-imported dependency and is never bundled into Babylon.\n\n/**\n * Shape of the `three-html-render` polyfill module (only the parts this wrapper uses).\n */\nexport interface IHtmlInCanvasPolyfillModule {\n    /** Installs the WICG HTML-in-Canvas polyfill onto the relevant DOM prototypes. */\n    installHtmlInCanvasPolyfill?: (options?: { force?: boolean }) => void;\n    /** Removes a previously installed polyfill. */\n    uninstallHtmlInCanvasPolyfill?: () => void;\n}\n\n/**\n * Options for {@link InstallHtmlInCanvasPolyfill}.\n */\nexport interface IInstallHtmlInCanvasPolyfillOptions {\n    /** Install the polyfill even when the browser already supports the API natively (default false). */\n    force?: boolean;\n    /** Module specifier to lazily import the polyfill from (default `\"three-html-render\"`). */\n    moduleSpecifier?: string;\n    /** A pre-imported polyfill module to use instead of dynamically importing one. */\n    polyfillModule?: IHtmlInCanvasPolyfillModule;\n}\n\nlet _InstalledModule: Nullable<IHtmlInCanvasPolyfillModule> = null;\n\n/**\n * Tracks the installer-owned polyfill so consumers use its legacy snapshot APIs even when newer native APIs remain exposed.\n * @internal\n */\nexport function _IsHtmlInCanvasPolyfillInstalled(): boolean {\n    return _InstalledModule !== null;\n}\n\n/**\n * Detects whether the browser supports the WICG HTML-in-Canvas API natively (or already has it installed).\n * @returns true when an HTMLCanvasElement exposes `captureElementImage`\n */\nexport function IsHtmlInCanvasSupportedNatively(): boolean {\n    if (typeof document === \"undefined\") {\n        return false;\n    }\n    const canvas = document.createElement(\"canvas\") as HTMLCanvasElement & { captureElementImage?: unknown };\n    return typeof canvas.captureElementImage === \"function\";\n}\n\n/**\n * Lazily installs the WICG HTML-in-Canvas polyfill (`three-html-render`) so that {@link HtmlTexture} and the\n * interaction managers work in browsers that do not yet ship the native API.\n *\n * The polyfill is an optional dependency: it is imported on demand and never bundled into Babylon. When the\n * browser already supports the API natively, this is a no-op unless `force` is set or the `?polyfillHIC` URL\n * flag is present.\n * @param options optional installation configuration\n * @returns a promise that resolves to true when the polyfill was installed, false otherwise\n */\nexport async function InstallHtmlInCanvasPolyfill(options: IInstallHtmlInCanvasPolyfillOptions = {}): Promise<boolean> {\n    const force = options.force ?? _HasPolyfillUrlFlag();\n\n    if (!force && IsHtmlInCanvasSupportedNatively()) {\n        return false;\n    }\n\n    const module = options.polyfillModule ?? (await _ImportPolyfill(options.moduleSpecifier ?? \"three-html-render\"));\n    if (!module || typeof module.installHtmlInCanvasPolyfill !== \"function\") {\n        Logger.Warn(\"HTML-in-Canvas: the polyfill module does not expose installHtmlInCanvasPolyfill; nothing was installed.\");\n        return false;\n    }\n\n    module.installHtmlInCanvasPolyfill(force ? { force: true } : undefined);\n    _InstalledModule = module;\n    return true;\n}\n\n/**\n * Removes a polyfill previously installed by {@link InstallHtmlInCanvasPolyfill}.\n */\nexport function UninstallHtmlInCanvasPolyfill(): void {\n    if (_InstalledModule && typeof _InstalledModule.uninstallHtmlInCanvasPolyfill === \"function\") {\n        _InstalledModule.uninstallHtmlInCanvasPolyfill();\n    }\n    _InstalledModule = null;\n}\n\nasync function _ImportPolyfill(specifier: string): Promise<Nullable<IHtmlInCanvasPolyfillModule>> {\n    try {\n        // The specifier is a variable so bundlers leave this as a runtime import and the optional package is\n        // not required to be installed at build time. The UMD/global build cannot resolve a bare module\n        // specifier, so this dynamic import is neutralized there (see rewriteDynamicExternalImportsPlugin);\n        // UMD consumers should pass `polyfillModule` instead.\n        return (await import(/* @vite-ignore */ /* webpackIgnore: true */ specifier)) as IHtmlInCanvasPolyfillModule;\n    } catch {\n        Logger.Warn(`HTML-in-Canvas: could not load polyfill module \"${specifier}\". Install three-html-render or pass a polyfillModule.`);\n        return null;\n    }\n}\n\nfunction _HasPolyfillUrlFlag(): boolean {\n    return typeof window !== \"undefined\" && !!window.location && /[?&]polyfillHIC\\b/i.test(window.location.search);\n}\n"]}

package/Materials/Textures/HTML/htmlInteractionManager.d.ts

@@ -30,9 +30,9 @@ export interface IHtmlInteractionManagerOptions {
  * Overlays the live HTML element of an {@link HtmlTexture} on top of the projected face of a planar mesh,
  * so the browser hit-tests the real DOM element natively (enabling focus, text selection and form input).
  *
- * Each frame the mesh face is projected to screen space and the element is translated, scaled and rotated
- * to match. This is best suited to planar, camera-facing surfaces. For arbitrary or curved meshes, use the
- * UV-based {@link HtmlRaycastInteractionManager} instead.
+ * Each frame the mesh face is projected to screen space and the element's canvas geometry is updated
+ * to match. Older implementations use a CSS transform instead. This is best suited to planar,
+ * camera-facing surfaces. For arbitrary or curved meshes, use the UV-based {@link HtmlRaycastInteractionManager} instead.
  *
  * The overlay is screen-aligned (position, size and in-plane rotation); it does not apply a full
  * perspective skew, so steeply oblique faces will not be perspective-correct.
@@ -43,6 +43,11 @@ export declare class HtmlInteractionManager {
     private readonly _element;
     private _observer;
     private _previousTransform;
+    private readonly _canvas;
+    private readonly _canvasTransform;
+    private readonly _geometryOptions;
+    private _geometryRegistered;
+    private readonly _stopPointerCapture;
     private readonly _viewport;
     private readonly _center;
     private readonly _xAxis;
@@ -61,6 +66,7 @@ export declare class HtmlInteractionManager {
      */
     constructor(scene: Scene, texture: HtmlTexture, mesh: AbstractMesh, options?: IHtmlInteractionManagerOptions);
     private _update;
+    private _clearGeometry;
     private _setTransform;
     /**
      * Detaches the manager and stops updating the overlay.

package/Materials/Textures/HTML/htmlInteractionManager.js

@@ -1,5 +1,6 @@
 import { Matrix, Vector3 } from "../../../Maths/math.vector.pure.js";
 import { Viewport } from "../../../Maths/math.viewport.js";
+import { _IsHtmlInCanvasPolyfillInstalled } from "./htmlInCanvasPolyfill.js";
 // Attribution: the overlay-and-hit-test technique used here is prior art from `three-html-render`
 // (Palash Bansal, MIT), three.js' `InteractionManager`, and Jake Archibald's `curved-markup` demo.
 // The implementation below is a clean-room rewrite against Babylon.js' own projection APIs.
@@ -25,9 +26,9 @@ export function ComputeOverlayCssTransform(centerX, centerY, scaleX, scaleY, rot
  * Overlays the live HTML element of an {@link HtmlTexture} on top of the projected face of a planar mesh,
  * so the browser hit-tests the real DOM element natively (enabling focus, text selection and form input).
  *
- * Each frame the mesh face is projected to screen space and the element is translated, scaled and rotated
- * to match. This is best suited to planar, camera-facing surfaces. For arbitrary or curved meshes, use the
- * UV-based {@link HtmlRaycastInteractionManager} instead.
+ * Each frame the mesh face is projected to screen space and the element's canvas geometry is updated
+ * to match. Older implementations use a CSS transform instead. This is best suited to planar,
+ * camera-facing surfaces. For arbitrary or curved meshes, use the UV-based {@link HtmlRaycastInteractionManager} instead.
  *
  * The overlay is screen-aligned (position, size and in-plane rotation); it does not apply a full
  * perspective skew, so steeply oblique faces will not be perspective-correct.
@@ -42,6 +43,11 @@ export class HtmlInteractionManager {
      */
     constructor(scene, texture, mesh, options = {}) {
         this._previousTransform = "";
+        this._canvas = null;
+        this._canvasTransform = null;
+        this._geometryOptions = null;
+        this._geometryRegistered = false;
+        this._stopPointerCapture = (event) => event.stopPropagation();
         // Reused across frames to avoid per-frame allocations.
         this._viewport = new Viewport(0, 0, 0, 0);
         this._center = new Vector3();
@@ -55,6 +61,20 @@ export class HtmlInteractionManager {
         this._scene = scene;
         this._mesh = mesh;
         this._element = options.targetElement ?? texture.element;
+        if (typeof HTMLCanvasElement !== "undefined" &&
+            texture.host instanceof HTMLCanvasElement &&
+            texture.host.content === "drawable" &&
+            typeof texture.host.updateElementGeometry === "function" &&
+            typeof texture.host.clearElementGeometry === "function" &&
+            this._element.hasAttribute("drawable") &&
+            texture.host.contains(this._element) &&
+            !_IsHtmlInCanvasPolyfillInstalled()) {
+            this._canvas = texture.host;
+            this._canvasTransform = new DOMMatrix();
+            this._geometryOptions = { canvasTransform: this._canvasTransform, preserveHitTestOrder: true };
+            // Otherwise the engine captures the pointer on the canvas and retargets the button's up/click.
+            this._element.addEventListener("pointerdown", this._stopPointerCapture);
+        }
         this._element.style.position = "absolute";
         this._element.style.left = "0px";
         this._element.style.top = "0px";
@@ -91,7 +111,12 @@ export class HtmlInteractionManager {
         Vector3.ProjectToRef(this._corner, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedY);
         // Hide the overlay when the face is behind the camera.
         if (this._projectedCenter.z < 0 || this._projectedCenter.z > 1) {
-            this._setTransform("translate(-99999px, -99999px)");
+            if (this._canvas) {
+                this._clearGeometry();
+            }
+            else {
+                this._setTransform("translate(-99999px, -99999px)");
+            }
             return;
         }
         const dpr = engine.getHardwareScalingLevel();
@@ -104,7 +129,39 @@ export class HtmlInteractionManager {
         const elementHeight = this._element.offsetHeight || 1;
         const scaleX = (2 * halfWidth) / elementWidth;
         const scaleY = (2 * halfHeight) / elementHeight;
-        this._setTransform(ComputeOverlayCssTransform(centerX, centerY, scaleX, scaleY, rotation, elementWidth, elementHeight));
+        if (this._canvas && this._canvasTransform && this._geometryOptions) {
+            const cosine = Math.cos(rotation);
+            const sine = Math.sin(rotation);
+            const a = cosine * scaleX;
+            const b = sine * scaleX;
+            const c = -sine * scaleY;
+            const d = cosine * scaleY;
+            const e = centerX - (a * elementWidth + c * elementHeight) / 2;
+            const f = centerY - (b * elementWidth + d * elementHeight) / 2;
+            const matrix = this._canvasTransform;
+            if (this._geometryRegistered && matrix.a === a && matrix.b === b && matrix.c === c && matrix.d === d && matrix.e === e && matrix.f === f) {
+                return;
+            }
+            matrix.a = a;
+            matrix.b = b;
+            matrix.c = c;
+            matrix.d = d;
+            matrix.e = e;
+            matrix.f = f;
+            this._canvas.updateElementGeometry(this._element, this._geometryOptions);
+            this._geometryRegistered = true;
+        }
+        else {
+            this._setTransform(ComputeOverlayCssTransform(centerX, centerY, scaleX, scaleY, rotation, elementWidth, elementHeight));
+        }
+    }
+    _clearGeometry() {
+        if (this._geometryRegistered && this._canvas) {
+            if (this._element.hasAttribute("drawable") && this._canvas.contains(this._element)) {
+                this._canvas.clearElementGeometry(this._element);
+            }
+            this._geometryRegistered = false;
+        }
     }
     _setTransform(transform) {
         if (transform === this._previousTransform) {
@@ -117,6 +174,8 @@ export class HtmlInteractionManager {
      * Detaches the manager and stops updating the overlay.
      */
     dispose() {
+        this._clearGeometry();
+        this._element.removeEventListener("pointerdown", this._stopPointerCapture);
         if (this._restoreInertOnDispose) {
             this._element.setAttribute("inert", "");
             this._restoreInertOnDispose = false;

package/Materials/Textures/HTML/htmlInteractionManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"htmlInteractionManager.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/HTML/htmlInteractionManager.ts"],"names":[],"mappings":"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","sourcesContent":["import { type Scene } from \"../../../scene.pure\";\nimport { type AbstractMesh } from \"../../../Meshes/abstractMesh.pure\";\nimport { type HtmlTexture } from \"./htmlTexture\";\nimport { type Observer } from \"../../../Misc/observable.pure\";\nimport { type Nullable } from \"../../../types\";\n\nimport { Matrix, Vector3 } from \"../../../Maths/math.vector.pure\";\nimport { Viewport } from \"../../../Maths/math.viewport\";\n\n// Attribution: the overlay-and-hit-test technique used here is prior art from `three-html-render`\n// (Palash Bansal, MIT), three.js' `InteractionManager`, and Jake Archibald's `curved-markup` demo.\n// The implementation below is a clean-room rewrite against Babylon.js' own projection APIs.\n\n/**\n * Builds the CSS `transform` string that positions an overlay element over the projected face of a mesh.\n *\n * The transform is applied with `transform-origin: 0 0`. Reading right to left it centers the element on\n * its own origin, scales and rotates it to match the projected face, then translates it to the projected\n * center (in CSS pixels, top-left origin).\n * @param centerX projected center X in CSS pixels\n * @param centerY projected center Y in CSS pixels\n * @param scaleX horizontal scale to apply to the element\n * @param scaleY vertical scale to apply to the element\n * @param rotation in-plane rotation in radians\n * @param elementWidth element width in pixels\n * @param elementHeight element height in pixels\n * @returns the CSS transform string\n */\nexport function ComputeOverlayCssTransform(\n    centerX: number,\n    centerY: number,\n    scaleX: number,\n    scaleY: number,\n    rotation: number,\n    elementWidth: number,\n    elementHeight: number\n): string {\n    return `translate(${centerX}px, ${centerY}px) rotate(${rotation}rad) scale(${scaleX}, ${scaleY}) translate(${-elementWidth / 2}px, ${-elementHeight / 2}px)`;\n}\n\n/**\n * Options for {@link HtmlInteractionManager}.\n */\nexport interface IHtmlInteractionManagerOptions {\n    /** The DOM element to overlay (defaults to the texture's element). */\n    targetElement?: HTMLElement;\n    /** Whether the overlay element captures pointer events so the browser hit-tests it natively (default true). */\n    enablePointerEvents?: boolean;\n}\n\n/**\n * Overlays the live HTML element of an {@link HtmlTexture} on top of the projected face of a planar mesh,\n * so the browser hit-tests the real DOM element natively (enabling focus, text selection and form input).\n *\n * Each frame the mesh face is projected to screen space and the element is translated, scaled and rotated\n * to match. This is best suited to planar, camera-facing surfaces. For arbitrary or curved meshes, use the\n * UV-based {@link HtmlRaycastInteractionManager} instead.\n *\n * The overlay is screen-aligned (position, size and in-plane rotation); it does not apply a full\n * perspective skew, so steeply oblique faces will not be perspective-correct.\n */\nexport class HtmlInteractionManager {\n    private readonly _scene: Scene;\n    private readonly _mesh: AbstractMesh;\n    private readonly _element: HTMLElement;\n    private _observer: Nullable<Observer<Scene>>;\n    private _previousTransform: string = \"\";\n\n    // Reused across frames to avoid per-frame allocations.\n    private readonly _viewport = new Viewport(0, 0, 0, 0);\n    private readonly _center = new Vector3();\n    private readonly _xAxis = new Vector3();\n    private readonly _yAxis = new Vector3();\n    private readonly _projectedCenter = new Vector3();\n    private readonly _projectedX = new Vector3();\n    private readonly _projectedY = new Vector3();\n    private readonly _corner = new Vector3();\n    private _restoreInertOnDispose: boolean = false;\n\n    /**\n     * Creates an overlay interaction manager.\n     * @param scene the scene whose camera drives the projection\n     * @param texture the HTML texture whose element should be overlaid\n     * @param mesh the planar mesh displaying the texture\n     * @param options optional configuration\n     */\n    constructor(scene: Scene, texture: HtmlTexture, mesh: AbstractMesh, options: IHtmlInteractionManagerOptions = {}) {\n        this._scene = scene;\n        this._mesh = mesh;\n        this._element = options.targetElement ?? texture.element;\n\n        this._element.style.position = \"absolute\";\n        this._element.style.left = \"0px\";\n        this._element.style.top = \"0px\";\n        this._element.style.transformOrigin = \"0 0\";\n        this._element.style.pointerEvents = (options.enablePointerEvents ?? true) ? \"auto\" : \"none\";\n\n        // This manager relies on native browser hit testing of the element. HtmlTexture marks the element\n        // `inert` while hosting it inside the rendering canvas (so it does not steal input from the canvas);\n        // clear that here so native interaction works, and restore it on dispose.\n        this._restoreInertOnDispose = this._element.hasAttribute(\"inert\");\n        if (this._restoreInertOnDispose) {\n            this._element.removeAttribute(\"inert\");\n        }\n\n        this._observer = scene.onAfterRenderObservable.add(() => this._update());\n    }\n\n    private _update(): void {\n        const camera = this._scene.activeCamera;\n        const engine = this._scene.getEngine();\n        if (!camera) {\n            return;\n        }\n\n        const boundingBox = this._mesh.getBoundingInfo().boundingBox;\n        const world = this._mesh.getWorldMatrix();\n        const extend = boundingBox.extendSize;\n\n        this._center.copyFrom(boundingBox.centerWorld);\n        // World-space half-axis directions of the mesh face.\n        Vector3.TransformNormalFromFloatsToRef(extend.x, 0, 0, world, this._xAxis);\n        Vector3.TransformNormalFromFloatsToRef(0, extend.y, 0, world, this._yAxis);\n\n        const transform = this._scene.getTransformMatrix();\n        camera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), this._viewport);\n\n        Vector3.ProjectToRef(this._center, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedCenter);\n        this._center.addToRef(this._xAxis, this._corner);\n        Vector3.ProjectToRef(this._corner, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedX);\n        this._center.addToRef(this._yAxis, this._corner);\n        Vector3.ProjectToRef(this._corner, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedY);\n\n        // Hide the overlay when the face is behind the camera.\n        if (this._projectedCenter.z < 0 || this._projectedCenter.z > 1) {\n            this._setTransform(\"translate(-99999px, -99999px)\");\n            return;\n        }\n\n        const dpr = engine.getHardwareScalingLevel();\n        const centerX = this._projectedCenter.x * dpr;\n        const centerY = this._projectedCenter.y * dpr;\n\n        const halfWidth = Math.hypot(this._projectedX.x - this._projectedCenter.x, this._projectedX.y - this._projectedCenter.y) * dpr;\n        const halfHeight = Math.hypot(this._projectedY.x - this._projectedCenter.x, this._projectedY.y - this._projectedCenter.y) * dpr;\n        const rotation = Math.atan2(this._projectedX.y - this._projectedCenter.y, this._projectedX.x - this._projectedCenter.x);\n\n        const elementWidth = this._element.offsetWidth || 1;\n        const elementHeight = this._element.offsetHeight || 1;\n        const scaleX = (2 * halfWidth) / elementWidth;\n        const scaleY = (2 * halfHeight) / elementHeight;\n\n        this._setTransform(ComputeOverlayCssTransform(centerX, centerY, scaleX, scaleY, rotation, elementWidth, elementHeight));\n    }\n\n    private _setTransform(transform: string): void {\n        if (transform === this._previousTransform) {\n            return;\n        }\n        this._previousTransform = transform;\n        this._element.style.transform = transform;\n    }\n\n    /**\n     * Detaches the manager and stops updating the overlay.\n     */\n    public dispose(): void {\n        if (this._restoreInertOnDispose) {\n            this._element.setAttribute(\"inert\", \"\");\n            this._restoreInertOnDispose = false;\n        }\n        if (this._observer) {\n            this._scene.onAfterRenderObservable.remove(this._observer);\n            this._observer = null;\n        }\n    }\n}\n"]}
+{"version":3,"file":"htmlInteractionManager.js","sourceRoot":"","sources":["../../../../../../dev/core/src/Materials/Textures/HTML/htmlInteractionManager.ts"],"names":[],"mappings":"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","sourcesContent":["import { type Scene } from \"../../../scene.pure\";\nimport { type AbstractMesh } from \"../../../Meshes/abstractMesh.pure\";\nimport { type HtmlTexture } from \"./htmlTexture\";\nimport { type Observer } from \"../../../Misc/observable.pure\";\nimport { type Nullable } from \"../../../types\";\n\nimport { Matrix, Vector3 } from \"../../../Maths/math.vector.pure\";\nimport { Viewport } from \"../../../Maths/math.viewport\";\nimport { _IsHtmlInCanvasPolyfillInstalled } from \"./htmlInCanvasPolyfill\";\n\n// Attribution: the overlay-and-hit-test technique used here is prior art from `three-html-render`\n// (Palash Bansal, MIT), three.js' `InteractionManager`, and Jake Archibald's `curved-markup` demo.\n// The implementation below is a clean-room rewrite against Babylon.js' own projection APIs.\n\n/**\n * Builds the CSS `transform` string that positions an overlay element over the projected face of a mesh.\n *\n * The transform is applied with `transform-origin: 0 0`. Reading right to left it centers the element on\n * its own origin, scales and rotates it to match the projected face, then translates it to the projected\n * center (in CSS pixels, top-left origin).\n * @param centerX projected center X in CSS pixels\n * @param centerY projected center Y in CSS pixels\n * @param scaleX horizontal scale to apply to the element\n * @param scaleY vertical scale to apply to the element\n * @param rotation in-plane rotation in radians\n * @param elementWidth element width in pixels\n * @param elementHeight element height in pixels\n * @returns the CSS transform string\n */\nexport function ComputeOverlayCssTransform(\n    centerX: number,\n    centerY: number,\n    scaleX: number,\n    scaleY: number,\n    rotation: number,\n    elementWidth: number,\n    elementHeight: number\n): string {\n    return `translate(${centerX}px, ${centerY}px) rotate(${rotation}rad) scale(${scaleX}, ${scaleY}) translate(${-elementWidth / 2}px, ${-elementHeight / 2}px)`;\n}\n\n/**\n * Options for {@link HtmlInteractionManager}.\n */\nexport interface IHtmlInteractionManagerOptions {\n    /** The DOM element to overlay (defaults to the texture's element). */\n    targetElement?: HTMLElement;\n    /** Whether the overlay element captures pointer events so the browser hit-tests it natively (default true). */\n    enablePointerEvents?: boolean;\n}\n\n/**\n * Overlays the live HTML element of an {@link HtmlTexture} on top of the projected face of a planar mesh,\n * so the browser hit-tests the real DOM element natively (enabling focus, text selection and form input).\n *\n * Each frame the mesh face is projected to screen space and the element's canvas geometry is updated\n * to match. Older implementations use a CSS transform instead. This is best suited to planar,\n * camera-facing surfaces. For arbitrary or curved meshes, use the UV-based {@link HtmlRaycastInteractionManager} instead.\n *\n * The overlay is screen-aligned (position, size and in-plane rotation); it does not apply a full\n * perspective skew, so steeply oblique faces will not be perspective-correct.\n */\nexport class HtmlInteractionManager {\n    private readonly _scene: Scene;\n    private readonly _mesh: AbstractMesh;\n    private readonly _element: HTMLElement;\n    private _observer: Nullable<Observer<Scene>>;\n    private _previousTransform: string = \"\";\n    private readonly _canvas: Nullable<HTMLCanvasElement> = null;\n    private readonly _canvasTransform: Nullable<DOMMatrix> = null;\n    private readonly _geometryOptions: Nullable<UpdateElementGeometryOptions> = null;\n    private _geometryRegistered = false;\n    private readonly _stopPointerCapture = (event: Event) => event.stopPropagation();\n\n    // Reused across frames to avoid per-frame allocations.\n    private readonly _viewport = new Viewport(0, 0, 0, 0);\n    private readonly _center = new Vector3();\n    private readonly _xAxis = new Vector3();\n    private readonly _yAxis = new Vector3();\n    private readonly _projectedCenter = new Vector3();\n    private readonly _projectedX = new Vector3();\n    private readonly _projectedY = new Vector3();\n    private readonly _corner = new Vector3();\n    private _restoreInertOnDispose: boolean = false;\n\n    /**\n     * Creates an overlay interaction manager.\n     * @param scene the scene whose camera drives the projection\n     * @param texture the HTML texture whose element should be overlaid\n     * @param mesh the planar mesh displaying the texture\n     * @param options optional configuration\n     */\n    constructor(scene: Scene, texture: HtmlTexture, mesh: AbstractMesh, options: IHtmlInteractionManagerOptions = {}) {\n        this._scene = scene;\n        this._mesh = mesh;\n        this._element = options.targetElement ?? texture.element;\n\n        if (\n            typeof HTMLCanvasElement !== \"undefined\" &&\n            texture.host instanceof HTMLCanvasElement &&\n            texture.host.content === \"drawable\" &&\n            typeof texture.host.updateElementGeometry === \"function\" &&\n            typeof texture.host.clearElementGeometry === \"function\" &&\n            this._element.hasAttribute(\"drawable\") &&\n            texture.host.contains(this._element) &&\n            !_IsHtmlInCanvasPolyfillInstalled()\n        ) {\n            this._canvas = texture.host;\n            this._canvasTransform = new DOMMatrix();\n            this._geometryOptions = { canvasTransform: this._canvasTransform, preserveHitTestOrder: true };\n            // Otherwise the engine captures the pointer on the canvas and retargets the button's up/click.\n            this._element.addEventListener(\"pointerdown\", this._stopPointerCapture);\n        }\n\n        this._element.style.position = \"absolute\";\n        this._element.style.left = \"0px\";\n        this._element.style.top = \"0px\";\n        this._element.style.transformOrigin = \"0 0\";\n        this._element.style.pointerEvents = (options.enablePointerEvents ?? true) ? \"auto\" : \"none\";\n\n        // This manager relies on native browser hit testing of the element. HtmlTexture marks the element\n        // `inert` while hosting it inside the rendering canvas (so it does not steal input from the canvas);\n        // clear that here so native interaction works, and restore it on dispose.\n        this._restoreInertOnDispose = this._element.hasAttribute(\"inert\");\n        if (this._restoreInertOnDispose) {\n            this._element.removeAttribute(\"inert\");\n        }\n\n        this._observer = scene.onAfterRenderObservable.add(() => this._update());\n    }\n\n    private _update(): void {\n        const camera = this._scene.activeCamera;\n        const engine = this._scene.getEngine();\n        if (!camera) {\n            return;\n        }\n\n        const boundingBox = this._mesh.getBoundingInfo().boundingBox;\n        const world = this._mesh.getWorldMatrix();\n        const extend = boundingBox.extendSize;\n\n        this._center.copyFrom(boundingBox.centerWorld);\n        // World-space half-axis directions of the mesh face.\n        Vector3.TransformNormalFromFloatsToRef(extend.x, 0, 0, world, this._xAxis);\n        Vector3.TransformNormalFromFloatsToRef(0, extend.y, 0, world, this._yAxis);\n\n        const transform = this._scene.getTransformMatrix();\n        camera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), this._viewport);\n\n        Vector3.ProjectToRef(this._center, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedCenter);\n        this._center.addToRef(this._xAxis, this._corner);\n        Vector3.ProjectToRef(this._corner, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedX);\n        this._center.addToRef(this._yAxis, this._corner);\n        Vector3.ProjectToRef(this._corner, Matrix.IdentityReadOnly, transform, this._viewport, this._projectedY);\n\n        // Hide the overlay when the face is behind the camera.\n        if (this._projectedCenter.z < 0 || this._projectedCenter.z > 1) {\n            if (this._canvas) {\n                this._clearGeometry();\n            } else {\n                this._setTransform(\"translate(-99999px, -99999px)\");\n            }\n            return;\n        }\n\n        const dpr = engine.getHardwareScalingLevel();\n        const centerX = this._projectedCenter.x * dpr;\n        const centerY = this._projectedCenter.y * dpr;\n\n        const halfWidth = Math.hypot(this._projectedX.x - this._projectedCenter.x, this._projectedX.y - this._projectedCenter.y) * dpr;\n        const halfHeight = Math.hypot(this._projectedY.x - this._projectedCenter.x, this._projectedY.y - this._projectedCenter.y) * dpr;\n        const rotation = Math.atan2(this._projectedX.y - this._projectedCenter.y, this._projectedX.x - this._projectedCenter.x);\n\n        const elementWidth = this._element.offsetWidth || 1;\n        const elementHeight = this._element.offsetHeight || 1;\n        const scaleX = (2 * halfWidth) / elementWidth;\n        const scaleY = (2 * halfHeight) / elementHeight;\n\n        if (this._canvas && this._canvasTransform && this._geometryOptions) {\n            const cosine = Math.cos(rotation);\n            const sine = Math.sin(rotation);\n            const a = cosine * scaleX;\n            const b = sine * scaleX;\n            const c = -sine * scaleY;\n            const d = cosine * scaleY;\n            const e = centerX - (a * elementWidth + c * elementHeight) / 2;\n            const f = centerY - (b * elementWidth + d * elementHeight) / 2;\n            const matrix = this._canvasTransform;\n            if (this._geometryRegistered && matrix.a === a && matrix.b === b && matrix.c === c && matrix.d === d && matrix.e === e && matrix.f === f) {\n                return;\n            }\n            matrix.a = a;\n            matrix.b = b;\n            matrix.c = c;\n            matrix.d = d;\n            matrix.e = e;\n            matrix.f = f;\n            this._canvas.updateElementGeometry(this._element, this._geometryOptions);\n            this._geometryRegistered = true;\n        } else {\n            this._setTransform(ComputeOverlayCssTransform(centerX, centerY, scaleX, scaleY, rotation, elementWidth, elementHeight));\n        }\n    }\n\n    private _clearGeometry(): void {\n        if (this._geometryRegistered && this._canvas) {\n            if (this._element.hasAttribute(\"drawable\") && this._canvas.contains(this._element)) {\n                this._canvas.clearElementGeometry(this._element);\n            }\n            this._geometryRegistered = false;\n        }\n    }\n\n    private _setTransform(transform: string): void {\n        if (transform === this._previousTransform) {\n            return;\n        }\n        this._previousTransform = transform;\n        this._element.style.transform = transform;\n    }\n\n    /**\n     * Detaches the manager and stops updating the overlay.\n     */\n    public dispose(): void {\n        this._clearGeometry();\n        this._element.removeEventListener(\"pointerdown\", this._stopPointerCapture);\n        if (this._restoreInertOnDispose) {\n            this._element.setAttribute(\"inert\", \"\");\n            this._restoreInertOnDispose = false;\n        }\n        if (this._observer) {\n            this._scene.onAfterRenderObservable.remove(this._observer);\n            this._observer = null;\n        }\n    }\n}\n"]}

package/Materials/Textures/HTML/htmlTexture.d.ts

@@ -19,9 +19,9 @@ export declare function IsHtmlInCanvasUploadSupported(engine: AbstractEngine): b
  *
  * This is a side-effect-free helper - it is only reachable when {@link HtmlTexture} (or a direct caller)
  * is imported, so it adds nothing to bundles that do not use it. It relies on
- * `WebGLRenderingContext.texElementImage2D` (WebGL) or `GPUQueue.copyElementImageToTexture` (WebGPU),
- * available either natively (behind chrome://flags/#canvas-draw-element) or through the
- * three-html-render polyfill.
+ * `WebGLRenderingContext.texElementSubImage2D` (WebGL) or `GPUQueue.drawElementImageToTexture` (WebGPU),
+ * with support for their older `texElementImage2D` / `copyElementImageToTexture` counterparts, including
+ * the three-html-render polyfill.
  * @param engine defines the engine that owns the texture
  * @param texture defines the internal texture to update
  * @param element defines the source HTML element (or captured ElementImage) to upload
@@ -61,11 +61,10 @@ export interface IHtmlTextureOptions {
  * A texture whose content is rendered from a live HTML element using the WICG HTML-in-Canvas API
  * (https://github.com/WICG/html-in-canvas).
  *
- * The element is hosted as a child of the engine's rendering canvas (which is marked `layoutsubtree`) so
- * the browser can lay it out and snapshot it; the WICG API requires the source element to be a direct
- * child of the canvas whose context performs the upload. Content is uploaded through
- * `WebGLRenderingContext.texElementImage2D` (WebGL) or `GPUQueue.copyElementImageToTexture` (WebGPU),
- * available either natively (behind chrome://flags/#canvas-draw-element) or via the three-html-render
+ * The element is hosted as a drawable child of the engine's rendering canvas (marked `content="drawable"`,
+ * or `layoutsubtree` on older implementations) so the browser can lay it out and snapshot it.
+ * Content is uploaded through `WebGLRenderingContext.texElementSubImage2D` (WebGL) or
+ * `GPUQueue.drawElementImageToTexture` (WebGPU), with support for older browsers and the three-html-render
  * polyfill (https://github.com/repalash/three-html-render). When neither is present, a built-in SVG
  * `<foreignObject>` fallback is used instead (see `useSvgFallback`).
  *
@@ -98,6 +97,8 @@ export declare class HtmlTexture extends BaseTexture {
     private _originalParent;
     private _originalNextSibling;
     private _addedInert;
+    private _addedDrawable;
+    private _updateRequested;
     private _width;
     private _height;
     /**
@@ -114,9 +115,8 @@ export declare class HtmlTexture extends BaseTexture {
      */
     getTextureMatrix(): Matrix;
     /**
-     * Requests the host canvas to emit a paint event on the next rendering update. When auto-update is
-     * enabled, this triggers a texture refresh in sync with the DOM. Falls back to an immediate update
-     * when the WICG API is not available.
+     * Requests a texture refresh in sync with the host canvas's next paint event, even when auto-update is
+     * disabled. Updates immediately when the engine's WICG upload API is not available.
      */
     requestUpdate(): void;
     /**