Can't draw a Line in WEBGL Renderer if previously a texture was defined

[bsondermann]

Hi,
when I want to draw a line with the WEBGL Renderer, it works no problem, but when I draw a 3D object with texture before that, the line won't be displayed.

• WebGL
• p5.js version: 1.4.0
• Web browser and version: Google Chrome 94.0.4606.61
• Operating System: Windows
• Steps to reproduce this:

let g;
let gtex;
function preload(){
  g = loadModel('js/gimbal.obj',false);
  gtex = loadImage('js/gimbaltex.png');
}
function setup(){
  createCanvas(720, 240,WEBGL);
  ortho();
}
function draw(){
  smooth();
  clear();
  
  translate(0,0,-100);
  noStroke();
  directionalLight(255, 255, 255,0,0, 1);
  directionalLight(255, 255, 255,0,0, -1);
  rotateX(PI);
  push();
  translate(-240,0,0); 
  scale(4+(2/3));
  texture(gtex); // when I disable this texture (comment it out), the line gets drawn no problem, but otherwise not.
  model(g);
  stroke(255,0,0);
  noFill();
  line(0,0,0,100,100,100);
}

files.zip
Here are the 3D Models!

Thanks
Bastian

[welcome]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

[bsondermann]

Update:
when I fill(255); or anything >0 after setting the stroke color and before setting noFill(); the line gets drawn.
So:

let g;
let gtex;
function preload(){
  g = loadModel('js/gimbal.obj',false);
  gtex = loadImage('js/gimbaltex.png');
}
function setup(){
  createCanvas(720, 240,WEBGL);
  ortho();
}
function draw(){
  smooth();
  clear();
  
  translate(0,0,-100);
  noStroke();
  directionalLight(255, 255, 255,0,0, 1);
  directionalLight(255, 255, 255,0,0, -1);
  rotateX(PI);
  push();
  translate(-240,0,0); 
  scale(4+(2/3));
  texture(gtex);
  model(g);
  stroke(255,0,0);
  fill(255);
  noFill();
  line(0,0,0,100,100,100);
}

works.
Is that intentional behavior?

[Qianqianye]

Thanks @bsondermann!
Inviting some WebGL stewards @davepagurek @jeffawang @AdilRabbani to this discussion.

[davepagurek]

For now, a workaround is to put your code using texture within a push() and pop().

The culprit is this line, which only draws strokes if we aren't in texture mode:
https://github.com/processing/p5.js/blob/main/src/webgl/p5.RendererGL.Immediate.js#L215

This was added in #2511, although there isn't discussion specifically about textures in that PR. I assume it's because textures don't work on lines, but I'm not certain. That said, strokes do currently work for retained geometry like sphere(), just not immediate mode geometry, so I think removing the && this.drawMode !== constants.TEXTURE from the doStroke declaration here would make sense!