{"record":{"id":"e3dab8eb91466efc","repo":"BabylonJS/Babylon.js","slug":"classname-this-name-the-depth-texture-size","errorCode":null,"errorMessage":"${className} ${this.name}: the depth texture (size: ${depthTextureDescription.size.width}x${depthTextureDescription.size.height}) and the target texture (size: ${outputTextureDescription.size.width}x${outputTextureDescription.size.height}) must have the same dimensions.","messagePattern":"(.+?) (.+?): the depth texture \\(size: (.+?)x(.+?)\\) and the target texture \\(size: (.+?)x(.+?)\\) must have the same dimensions\\.","errorType":"validation","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/dev/core/src/FrameGraph/Tasks/Rendering/objectRendererTask.ts","lineNumber":562,"sourceCode":"        let depthEnabled = false;\r\n\r\n        if (this.depthTexture !== undefined) {\r\n            if (outputTextureDescription && this.depthTexture !== backbufferDepthStencilTextureHandle && targetTextures[0] === backbufferColorTextureHandle) {\r\n                throw new Error(`${className} ${this.name}: the back buffer depth/stencil texture is the only depth texture allowed when the target is the back buffer color`);\r\n            }\r\n\r\n            const depthTextureDescription = this._frameGraph.textureManager.getTextureDescription(this.depthTexture);\r\n            if (!outputTextureDescription) {\r\n                outputTextureDescription = depthTextureDescription;\r\n            }\r\n            if (depthTextureDescription.options.samples !== outputTextureDescription.options.samples) {\r\n                throw new Error(\r\n                    `${className} ${this.name}: the depth texture \"${depthTextureDescription.options.labels?.[0] ?? \"noname\"}\" (${depthTextureDescription.options.samples} samples) and the output texture \"${outputTextureDescription.options.labels?.[0] ?? \"noname\"}\" (${outputTextureDescription.options.samples} samples) must have the same number of samples`\r\n                );\r\n            }\r\n\r\n            if (depthTextureDescription.size.width !== outputTextureDescription.size.width || depthTextureDescription.size.height !== outputTextureDescription.size.height) {\r\n                throw new Error(\r\n                    `${className} ${this.name}: the depth texture (size: ${depthTextureDescription.size.width}x${depthTextureDescription.size.height}) and the target texture (size: ${outputTextureDescription.size.width}x${outputTextureDescription.size.height}) must have the same dimensions.`\r\n                );\r\n            }\r\n\r\n            depthEnabled = true;\r\n        }\r\n\r\n        this._textureWidth = outputTextureDescription?.size.width ?? 1;\r\n        this._textureHeight = outputTextureDescription?.size.height ?? 1;\r\n\r\n        return depthEnabled;\r\n    }\r\n\r\n    protected _getTargetHandles(): FrameGraphTextureHandle[] {\r\n        return Array.isArray(this.targetTexture) ? this.targetTexture : [this.targetTexture];\r\n    }\r\n\r\n    protected _prepareRendering(context: FrameGraphRenderContext, depthEnabled: boolean): Nullable<number[]> {\r","sourceCodeStart":544,"sourceCodeEnd":580,"githubUrl":"https://github.com/BabylonJS/Babylon.js/blob/0592b347b8a4ee0236089ea86a749cacfdb266d8/packages/dev/core/src/FrameGraph/Tasks/Rendering/objectRendererTask.ts#L544-L580","documentation":"The depth texture and the target (output) texture must have identical pixel dimensions because a render pass's depth and color attachments must match in size. When getTextureDescription reports differing width/height, _checkTextureCompatibility throws with both sizes in the message.","triggerScenarios":"Depth texture created at a different resolution than the target texture (e.g. depth 1024x1024 vs target 512x512), or a resize of one texture without resizing the other, detected during record().","commonSituations":"Hard-coded depth texture sizes not matching render target size; window resize updating color target but not depth; shadow/RTT pipelines reusing a depth texture of a legacy size.","solutions":["Recreate the depth texture at the same width/height as the target texture.","Derive depth texture size from the target's description instead of hard-coding it.","Register a resize handler that resizes both textures together."],"exampleFix":"// before\nconst depth = frameGraph.createDepthStencilTexture('depth', { size: { width: 1024, height: 1024 } });\n\n// after\nconst desc = frameGraph.textureManager.getTextureDescription(targetTextureHandle);\nconst depth = frameGraph.createDepthStencilTexture('depth', { size: { width: desc.size.width, height: desc.size.height } });","handlingStrategy":"validation","validationCode":"const targetDesc = frameGraph.textureManager.getTextureDescription(targetHandle);\nconst depthDesc = frameGraph.textureManager.getTextureDescription(depthHandle);\nif (depthDesc.size.width !== targetDesc.size.width || depthDesc.size.height !== targetDesc.size.height) {\n    throw new Error('Depth texture must match target size');\n}","typeGuard":null,"tryCatchPattern":"try {\n    frameGraph.build();\n} catch (e) {\n    if (String(e).includes('must have the same dimensions')) {\n        recreateDepthMatching(targetHandle);\n        frameGraph.build();\n    } else throw e;\n}","preventionTips":["Never hard-code depth texture sizes; derive from the target description.","Handle resize events by resizing color and depth attachments together.","Compare sizes of all attachments in a pre-build sanity check."],"tags":["babylonjs","frame-graph","depth-texture","size-mismatch","render-target"],"backgroundTag":"render-target-size-mismatch","analyzedSha":"0592b347b8a4ee0236089ea86a749cacfdb266d8","analyzedAt":"2026-08-30T15:11:20.442Z","schemaVersion":2},"datasetVersion":"2026-08-30T18:17:15.746Z"}