Add fontWidth() and clarify textWidth vs fontWidth docs in textCore.js #7745

[NalinDalal]

Resolves #7745

Adds a new user-facing function, fontWidth(), to the p5.js library and updates the documentation to clearly distinguish between advance width and tight bounding box measurements for text. All changes are made in src/type/textCore.js.

Changes

• New Function:
  fontWidth() returns the advance width (loose measurement) of a string, including all leading and trailing whitespace, as measured by the browser’s measureText().width.

• Documentation Updates:

  • Added comprehensive JSDoc and usage examples for fontWidth().
  • Updated textWidth() documentation to clarify that it returns the tight bounding box width, which may ignore leading/trailing whitespace.
  • Both docs now include a direct comparison, cross-references, and clear examples.

Motivation

• Resolves confusion in p5.js 2.0 about the difference between textWidth() and the new fontWidth() regarding whitespace handling.
• Provides clear, side-by-side documentation for both functions.

Example Usage

let s = '   x y   ';
let advance = fontWidth(s); // includes all whitespace
let tight = textWidth(s);   // may ignore whitespace

Related Issues

• Resolves [p5.js 2.0 Beta Bug Report]: Document difference between textWidth and fontWidth with respect to whitespace #7745

Checklist

• Added new function fontWidth()
• Updated documentation and examples in src/type/textCore.js
• No changes to p5.Font.js
• All changes on dev-2.0 branch

PR Checklist

• npm run lint passes
• [Inline reference] is included / updated
• [Unit tests] are included / updated

[ksen0]

Hi @NalinDalal , thank you for your work and enthusiasm on this, however this PR is quite a bit beyond the scope of the original issue. The issue is with clarify in documentation only; both fontWidth and textWidth are part of p5.js 2.0, and it's true that no functionality changes to p5.Font.js are needed. Regarding attributes.js, you mention that "All documentation and code changes are limited to attributes.js as per maintainer feedback." - however I see that in Discord, both @perminder-17 and @davepagurek did not suggest making a new file, but rather focusing on documentation only.

That means JSDoc on the existing fontWidth and textWidth functions, but not creating a new file, not moving existing functions, and not adding new functions.

I noticed another person wanted to work on this, so if they want to work on this issue, please let them go ahead:

You should not “jump the queue” by filing a PR for an issue that either someone else has indicated willingness to submit a contribution or has already been assigned to someone else. We will always prioritize the “first assigned, first serve” order for accepting code contributions for an issue. (Contributor Guidelines)

If they respond on the original issue that they're not interested, I'm happy to assign it to you and help you finish this PR. However, if they want to work on this, please close this PR; thank you for your understanding!

[NalinDalal]

I will then just mark it as draft then, thanks for your comments

[perminder-17]

Thanks so much for your work and enthusiasm on this! As Kit noted above, another contributor is already actively working on this issue. To follow our contributor guidelines, I’m going to close this PR for now.

If for any reason the other effort stalls or can’t be completed, we’ll be happy to revisit and help adapt your changes here.

Apologies for the inconvenience, and thank you again for your understanding and contributions, we really appreciate it.