text() with maxWidth and maxHeight removes '\t' tabs

[ffd8]

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• p5.strands
• WebGL
• DevOps, Build process, Unit testing
• Internationalization (i18n)
• Friendly Errors
• Other (specify if possible)

p5.js version

1.11.11

Web browser and version

Chrome 143.0.7499.193

Operating system

MacOSX 13.6.5

Steps to reproduce this

Steps:

1. Create text() with text containing tabs \t
2. Give textbox a maxWidth and maxHeight
3. Tabs are stripped from text

Snippet:

function setup() {
	createCanvas(windowWidth, windowHeight)
}

function draw() {
	background(0)
	fill(255)
	let txt = 'here is \n\tsome text'
	textSize(50)
	text(txt, 0, 0) // has tabs
	// text(txt, 0, 0, width, height) // removes tabs
}

[rakesh2OO5]

I tested the exact snippet on main (1.11.12-rc.0) using text(txt, 0, 0, width, height). Tabs render correctly in both bounded and unbounded cases now.

This seems to be fixed since 1.11.11. I can try to locate the commit that changed this and add a regression test if that would be helpful.

Screenshot :

[rakesh2OO5]

I tested the same snippet on Windows + Brave (Chromium) with p5.js 1.11.11 and couldn’t reproduce the issue — tabs render correctly in both bounded and unbounded cases.

This may be macOS- or browser-specific (original report was macOS + Chrome). It might be worth confirming with another macOS user or testing across Safari/Firefox on macOS.

Screenshot :

[rakesh2OO5]

Quick summary of my testing so far:

-macOS + Chrome (original report): bug reported in 1.11.11
-Windows + Brave (Chromium) + 1.11.11: I couldn’t reproduce — tabs render correctly in bounded and unbounded cases
-main / 1.11.12-rc.0: tabs also render correctly with text(txt, 0, 0, width, height)

This suggests the behavior may be environment-specific (macOS/Chrome) rather than a general p5.js regression.
If helpful, I can add a small regression test or propose a normalization step (\t → spaces) to make bounded text behavior consistent across platforms.

[AsimeniaKitsou]

Hi! I tested the text() function with maxWidth and maxHeight in the p5.js editor.
Code used: (javascript)
function setup() {
createCanvas(400, 200);
background(220);
let myText = "Line1\tTab1\nLine2\tTab2\nLine3\tTab3";
textSize(20);
text(myText, 10, 30, 300, 150);
}
The tabs (\t) are displayed correctly in my environment and are not removed.
Browser: Chrome
OS: Windows
This is part of my university open-source contribution assignment.