Renderer: add base setBlendMode/GPURenderer, clean up as-any casts

- Add setBlendMode() to base Renderer class for TypeScript compatibility
- Add GPURenderer property to base Renderer (WebGL overrides with GPU string)
- Remove renderer as-any casts in header.ts and resize.ts
- Remove unused context param from Canvas setBlendMode and resize.ts

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: obiot

packages/melonjs/src/application/header.ts

@@ -8,12 +8,11 @@ import type Application from "./application.ts";
 export function consoleHeader(app: Application): void {
 	const renderType = app.renderer.type;
 	const gpu_renderer =
-		typeof (app.renderer as any).GPURenderer === "string"
-			? ` (${(app.renderer as any).GPURenderer})`
+		typeof app.renderer.GPURenderer === "string"
+			? ` (${app.renderer.GPURenderer})`
 			: "";
 	const depthTesting =
-		renderType.includes("WebGL") &&
-		(app.renderer as any).depthTest === "z-buffer"
+		renderType.includes("WebGL") && app.renderer.depthTest === "z-buffer"
 			? "Depth Test | "
 			: "";
 	const audioType = device.hasWebAudio ? "Web Audio" : "HTML5 Audio";

packages/melonjs/src/application/resize.ts

@@ -12,7 +12,6 @@ import type Application from "./application.ts";
 function scale(game: Application, x: number, y: number): void {
 	const renderer = game.renderer;
 	const canvas = renderer.getCanvas();
-	const context = renderer.getContext();
 	const settings = renderer.settings as any;
 	const pixelRatio = device.devicePixelRatio;
 
@@ -28,7 +27,7 @@ function scale(game: Application, x: number, y: number): void {
 
 	// if anti-alias and blend mode were reset (e.g. Canvas mode)
 	renderer.setAntiAlias(settings.antiAlias);
-	(renderer as any).setBlendMode(settings.blendMode, context);
+	renderer.setBlendMode(settings.blendMode);
 
 	// force repaint
 	game.repaint();

packages/melonjs/src/video/canvas/canvas_renderer.js

@@ -140,11 +140,10 @@ export default class CanvasRenderer extends Renderer {
 	 * <img src="../images/exclusion-blendmode.png" width="180"/> <br>
 	 * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
 	 * @param {string} [mode="normal"] - blend mode
-	 * @param {CanvasRenderingContext2D} [context]
 	 * @returns {string} the blend mode actually applied (may differ if the requested mode is unsupported)
 	 */
-	setBlendMode(mode = "normal", context) {
-		context = context || this.getContext();
+	setBlendMode(mode = "normal") {
+		const context = this.getContext();
 		this.currentBlendMode = mode;
 		switch (mode) {
 			case "lighter":

packages/melonjs/src/video/renderer.js

@@ -73,6 +73,12 @@ export default class Renderer {
 		 */
 		this.depthTest = "sorting";
 
+		/**
+		 * The GPU renderer string (WebGL only, undefined for Canvas)
+		 * @type {string|undefined}
+		 */
+		this.GPURenderer = undefined;
+
 		/**
 		 * The Path2D instance used by the renderer to draw primitives
 		 * @type {Path2D}
@@ -240,6 +246,16 @@ export default class Renderer {
 		return this.currentBlendMode;
 	}
 
+	/**
+	 * set the current blend mode.
+	 * Subclasses (CanvasRenderer, WebGLRenderer) implement the actual GL/Canvas logic.
+	 * @param {string} [mode="normal"] - blend mode
+	 * @param {boolean} [premultipliedAlpha=true] - whether textures use premultiplied alpha (WebGL only)
+	 */
+	setBlendMode(mode = "normal") {
+		this.currentBlendMode = mode;
+	}
+
 	/**
 	 * get the current fill & stroke style color.
 	 * @returns {Color} current global color