<h5 dir="auto">Description of the problem</h5>
<p dir="auto"><a href="https://github.com/mrdoob/three.js/blob/dev/src/objects/Mesh.d.ts#L16">https://github.com/mrdoob/three.js/blob/dev/src/objects/Mesh.d.ts#L16</a></p>
<p dir="auto">The type of property <code class="notranslate">material</code> on the <code class="notranslate">Mesh</code> class is <code class="notranslate">Material | Material[]</code>.</p>
<p dir="auto">I run into an issue when i use:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const myMesh = new Mesh( someGeometry, new MeshBasicMaterial())
myMesh.material.map = foo //error"><pre class="notranslate"><code class="notranslate">const myMesh = new Mesh( someGeometry, new MeshBasicMaterial())
myMesh.material.map = foo //error
</code></pre></div>
<p dir="auto">The workaround for me is:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const someMaterial = new MeshBasicMaterial()
const myMesh = new Mesh(someGeometry, someMaterial)
someMaterial.map = foo // no error, because the interface is from MeshBasicMaterial"><pre class="notranslate"><code class="notranslate">const someMaterial = new MeshBasicMaterial()
const myMesh = new Mesh(someGeometry, someMaterial)
someMaterial.map = foo // no error, because the interface is from MeshBasicMaterial
</code></pre></div>
<p dir="auto">However, the code can end up being somewhat ugly. I tend to end up with something like:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  this.material // :Material
  this._typedMaterial // ShaderMaterial"><pre class="notranslate"><code class="notranslate">  this.material // :Material
  this._typedMaterial // ShaderMaterial
</code></pre></div>
<p dir="auto">Prettier goes crazy when i try to cast it and i end up with something like:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content=" ;(this.material as MeshBasicMaterial).map = foo"><pre class="notranslate"><code class="notranslate"> ;(this.material as MeshBasicMaterial).map = foo
</code></pre></div>
<p dir="auto">If i have a few lines to set, i need to do this on each, hence storing it in a variable with the proper type feels less awkward.</p>
<p dir="auto">Even something that is generic and common for all <code class="notranslate">Material</code> sub classes fails because of the <code class="notranslate"> | Material[]</code> such as <code class="notranslate">dephTest</code>.</p>
<p dir="auto">I was wondering if something involving generics could be applied here, ie:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const myMesh = new Mesh&lt;MeshBasicMaterial&gt;(someGeometry, new MeshBasicMaterial)
myMesh.map = foo //no error because Mesh would use &lt;T&gt;"><pre class="notranslate"><code class="notranslate">const myMesh = new Mesh&lt;MeshBasicMaterial&gt;(someGeometry, new MeshBasicMaterial)
myMesh.map = foo //no error because Mesh would use &lt;T&gt;
</code></pre></div>
<p dir="auto">I'm not sure what the exact syntax for this could be, and if <code class="notranslate">&lt;T&gt;</code> can be limited to a subclass of <code class="notranslate">Material</code>, but the <code class="notranslate">Material</code> interface seems somewhat awkward since it's sort of a utility class, everything we end up using extends from it. But even the class being generic is not that much of an issue, the possibility of the type being an array breaks it more.</p>
<p dir="auto">Is this an issue, and if it is, what would be the solution? Is there a more elegant typescript approach where the property could be just inferred from the type of material passed?</p>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Dev</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r116</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Chrome</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Firefox</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Internet Explorer</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Windows</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> macOS</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Linux</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Android</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> iOS</li>
</ul>
<h5 dir="auto">Description of the problem</h5>
<p dir="auto">Hi, it would be really great to be able to specify generics from <code class="notranslate">Geometry | BufferGeometry</code> and <code class="notranslate">Material</code> in <code class="notranslate">Mesh.d.ts</code>.</p>
<p dir="auto">In my current project, I need to change the <code class="notranslate">Material</code> property dynamically and I always need to keep an external reference on the <code class="notranslate">Material</code> class used to avoid casting. This change would avoid to always keep the reference and avoid casting.</p>
<p dir="auto">Change request:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="export class Mesh&lt;TGeometry extends Geometry | BufferGeometry = Geometry | BufferGeometry, TMaterial extends Material  | Material[] = Material  | Material[]&gt; extends Object3D {

	constructor(
		geometry?: TGeometry,
		material?: TMaterial
	);

	geometry: TGeometry;
	material: TMaterial;
	morphTargetInfluences?: number[];
	morphTargetDictionary?: { [key: string]: number };
	readonly isMesh: true;
	type: string;

	updateMorphTargets(): void;
	raycast( raycaster: Raycaster, intersects: Intersection[] ): void;
}"><pre class="notranslate"><code class="notranslate">export class Mesh&lt;TGeometry extends Geometry | BufferGeometry = Geometry | BufferGeometry, TMaterial extends Material  | Material[] = Material  | Material[]&gt; extends Object3D {

	constructor(
		geometry?: TGeometry,
		material?: TMaterial
	);

	geometry: TGeometry;
	material: TMaterial;
	morphTargetInfluences?: number[];
	morphTargetDictionary?: { [key: string]: number };
	readonly isMesh: true;
	type: string;

	updateMorphTargets(): void;
	raycast( raycaster: Raycaster, intersects: Intersection[] ): void;
}
</code></pre></div>
<p dir="auto">Usage</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const mesh = new Mesh&lt;BufferGeometry, MeshPhongMaterial&gt;(myGeometry, myMaterial);

const material: MeshPhongMaterial = mesh.material;
"><pre class="notranslate"><code class="notranslate">const mesh = new Mesh&lt;BufferGeometry, MeshPhongMaterial&gt;(myGeometry, myMaterial);

const material: MeshPhongMaterial = mesh.material;

</code></pre></div>
<h5 dir="auto">Three.js version</h5>
<ul dir="auto">
<li>[ X ] r115</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
</ul>
<p dir="auto">It would be my first time to make a feature request? Can I do a pull request by myself? What's the procedure?</p>
<p dir="auto">Thank you</p>