HTMLTexture: Add requestPaint() support.

src/textures/HTMLTexture.js

@@ -1,10 +1,10 @@
 import { Texture } from './Texture.js';
 
 /**
- * Creates a texture from a html element.
+ * Creates a texture from an HTML element.
  *
  * This is almost the same as the base texture class, except that it sets {@link Texture#needsUpdate}
- * to `true` immediately since a html can directly be used for rendering.
+ * to `true` immediately and listens for the parent canvas's paint events to trigger updates.
  *
  * @augments Texture
  */
@@ -13,7 +13,7 @@ class HTMLTexture extends Texture {
 	/**
 	 * Constructs a new texture.
 	 *
-	 * @param {HTMLElement} [canvas] - The HTML element.
+	 * @param {HTMLElement} [element] - The HTML element.
 	 * @param {number} [mapping=Texture.DEFAULT_MAPPING] - The texture mapping.
 	 * @param {number} [wrapS=ClampToEdgeWrapping] - The wrapS value.
 	 * @param {number} [wrapT=ClampToEdgeWrapping] - The wrapT value.
@@ -23,9 +23,9 @@ class HTMLTexture extends Texture {
 	 * @param {number} [type=UnsignedByteType] - The texture type.
 	 * @param {number} [anisotropy=Texture.DEFAULT_ANISOTROPY] - The anisotropy value.
 	 */
-	constructor( canvas, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy ) {
+	constructor( element, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy ) {
 
-		super( canvas, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy );
+		super( element, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy );
 
 		/**
 		 * This flag can be used for type testing.
@@ -39,6 +39,34 @@ class HTMLTexture extends Texture {
 
 		this.needsUpdate = true;
 
+		const parent = element ? element.parentNode : null;
+
+		if ( parent !== null && 'requestPaint' in parent ) {
+
+			parent.onpaint = () => {
+
+				this.needsUpdate = true;
+
+			};
+
+			parent.requestPaint();
+
+		}
+
+	}
+
+	dispose() {
+
+		const parent = this.image ? this.image.parentNode : null;
+
+		if ( parent !== null && 'onpaint' in parent ) {
+
+			parent.onpaint = null;
+
+		}
+
+		super.dispose();
+
 	}
 
 }