Added tests for multiline text support #261

ANAMASGARD · 2025-10-21T16:03:20Z

Add Multi-line Text Support Throughout animint2

Fixes #221

This PR enables newline characters (\n) to work in all text elements of animint2 visualizations. Users can now create multi-line text in plot titles, axis labels, legend titles, and geom_text labels.

What Now Works:
✅ Plot titles - ggtitle("Line 1\nLine 2")
✅ X-axis titles - xlab("X Axis\nSubtitle")
✅ Y-axis titles - ylab("Y Axis\nSubtitle")
✅ Legend titles - scale_color_discrete(name="Legend\nTitle")
✅ Text labels - geom_text(aes(label="Text\nLabel"))
✅ Tooltips - Already worked, still works (backward compatible)

Below is the screenshots of the scripts i ran locally to verify the test locally they fail as aspected

Tests check that \n converts to in: - plot titles (ggtitle) - axis titles (xlab/ylab) - legend titles - geom_text labels Currently fail since feature not implemented. Addresses #221

Changes: - R/z_multiline.R: new helper to convert \n to - R/z_animint.R: apply conversion to plot title, x/y axis titles - R/z_animintHelpers.R: apply conversion to legend titles and geom_text labels - inst/htmljs/animint.js: render as SVG tspan elements, fix overlap with proper height calculation - DESCRIPTION: add z_multiline.R to Collate - NEWS.md: document multiline text support Fixes #221

ANAMASGARD · 2025-10-21T16:21:26Z

Add Multi-line Text Support Throughout animint2

Fixes #221

Summary

This PR enables newline characters (\n) to work in all text elements of animint2 visualizations, not just tooltips. Users can now create multi-line text in plot titles, axis labels, legend titles, and geom_text labels.

What Now Works

✅ Plot titles - ggtitle("Line 1\nLine 2")
✅ X-axis titles - xlab("X Axis\nSubtitle")
✅ Y-axis titles - ylab("Y Axis\nSubtitle")
✅ Legend titles - scale_color_discrete(name="Legend\nTitle")
✅ Text labels - geom_text(aes(label="Text\nLabel"))
✅ Tooltips - Already worked, still works (backward compatible)

Visual Verification

The screenshot below demonstrates multi-line text working correctly in all contexts:

Example Usage

library(animint2)

data <- data.frame(
  x = 1:5,
  y = 1:5,
  group = c("A", "B", "C", "A", "B"),
  label = c("Single", "Two\nLines", "Three\nLines\nHere", "Text", "Label")
)

viz <- animint(
  plot1 = ggplot(data, aes(x, y, color = group, label = label)) +
    geom_point(size = 5) +
    geom_text(vjust = -1) +
    ggtitle("Multi-line Test\nIssue #221 Demonstration") +
    xlab("X Axis\n(Horizontal Position)") +
    ylab("Y Axis\n(Vertical Position)") +
    scale_color_discrete(name = "Data Group\n(Click to Select)")
)

animint2dir(viz, "output-dir")

tdhock · 2025-10-21T16:55:22Z

No obvious timing issues in HEAD=multiline-text-support-221

Generated via commit acbc6da

Download link for the artifact containing the test results: ↓ atime-results.zip

Task	Duration
R setup and installing dependencies	2 minutes and 23 seconds
Installing different package versions	14 seconds
Running and plotting the test cases	3 minutes and 35 seconds

ANAMASGARD · 2025-10-21T17:26:06Z

Ran tests locally - all 19 multiline text tests pass successfully. The test failures shown are due to missing optional packages (mapproj, sp, XML) and GitHub API permissions, not related to this PR. Sir can you please help me figure out on how to pass the JS_Coverage test suite .

tdhock · 2025-10-21T17:53:49Z

To get this PR to close the corresponding issue, please add

Closes #221

on its own line, in the first comment of the PR.

tdhock · 2025-10-21T17:56:15Z

looks like a step in the right direction, thanks!
however here #261 (comment) the second line of the overall title "Issue #221 Demonstration" is going into the plotting area.
Can you please add a test which makes sure the bottom of this title element is above the plotting area? (it should fail for the current code)

tdhock · 2025-10-21T17:59:47Z

Also in #261 (comment) it seems like there is an inconsistency between the X and Y axes.

there is almost no space between the Y axis title (Vertical Position) and the Y axis ticks (2 3 4)
there is a big space between the X axis title (X Axis) and the X axis tick (3).

can this be adjusted to be more consistent please?
also it should be consistent with the case of single line X/y axis title, as below from https://5-merge--animint-manual-en.netlify.app/ch06/#aes-tooltip which was created with current master

tdhock

please add tests then fix

Tests check: - plot title doesn't overlap with plot area - x-axis and y-axis spacing is consistent - multiline spacing matches single-line baseline Tests currently fail, demonstrating the bugs in current code. Addresses feedback on PR #261.

Two fixes: 1. Add 5px margin below title to prevent overlap with plot area 2. Use same base spacing (30px) for both X and Y axis labels Both axes now have consistent spacing, and multiline titles stay above the plot area. Addresses feedback on PR #261.

inst/htmljs/animint.js

tdhock

please simplify height/width calculation

- removed hardcoded -1000 positioning - reuse setMultilineText() instead of duplicating logic - rely on getBBox() for accurate measurements fixes spacing issues

inst/htmljs/animint.js

…nt/animint2 into multiline-text-support-221

tests/testthat/test-multiline-spacing.R

tdhock · 2025-10-23T13:50:41Z

can you please post an updated screen shot?

Axis titles were stuck at 16px even when theme(text=element_text(size=30)) was set. Now they properly inherit the size from theme settings. I saw your #64 coment

ANAMASGARD · 2025-11-07T06:54:51Z

Sir @tdhock Fixed the axis title font size issue.

Axis titles now scale correctly with theme(text=element_text(size=30)).

Changes:
R/z_animint.R :- Extract axis title sizes from theme
inst/htmljs/animint.js :- Apply those sizes to axis title text elements

Tested with different font sizes (10, 30, 50) - all working locally on my system .

Please Sir review it and give your feedback !!!

Add tests to verify axis titles correctly inherit theme text size. This improves code coverage for the axis title font-size fix. Tests verify: - Axis titles scale with theme(text=element_text(size=30)) - Default size is used when theme not specified - Both xtitle_size and ytitle_size are correctly extracted

Document multiline text spacing fixes and axis title font-size scaling fix in NEWS.md

ANAMASGARD · 2025-11-07T07:42:18Z

Sir @tdhock
The problem was axis titles didn't scale with theme(text=element_text(size=30)). Added extraction of axis title sizes from theme in R and use them in the renderer. Previous tests failed because we weren't testing this specific case, so I added 2 new tests to cover it. Also added PR#261 to NEWS.md. All tests pass locally now.

Please give your feedback !!!

inst/htmljs/animint.js

tdhock

please revise and explain

- Use 2-space indentation consistently - Remove extra blank lines in functions - Document 1.2 lineHeight magic number - Keep .each() for D3 element selection

ANAMASGARD · 2025-11-07T16:23:16Z

Sir @tdhock I have fixed all code style issues :=>

2-space indentation
Removed blank lines
Documented lineHeight (1.2em = standard SVG line spacing)
Kept .each() because D3 needs it for element selection
Both   splitting and forEach loops needed:   is intermediate format from R, forEach creates actual tspan elements SVG can render

All tests passed locally on my system .

tdhock · 2025-11-08T12:48:18Z

to understand why the test cases fail, you should try running them line by line under chromote, after tests_init(), and then look at the output in the remote controlled web browser window https://github.com/animint/animint2/wiki/Testing

The xtitle text element was missing the transform attribute, which caused renderer tests to fail with 'subscript out of bounds' errors when trying to access xtitle.attrs[["transform"]]. Added transform='translate(0,0)' to match ytitle and plottitle elements, ensuring consistent structure for all title elements. This fixes test failures in: - test-renderer1-facet-space.R (line 42) - test-renderer1-facet-trivial.R (line 32) Addresses maintainer feedback from PR #261.

Tests expect transform='translate(x,y)' pattern but we were using separate x/y attributes plus 'translate(0,0)'. Fixed all title elements to use transform for positioning: - plottitle: translate(plotdim.title.x, plotdim.title.y) - xtitle: translate((xtitle_left+xtitle_right)/2, xtitle_y) - ytitle: translate(ytitle_x, (ytitle_top+ytitle_bottom)/2)rotate(270) This matches the original code structure and the translatePattern regex expected by tests. Fixes test-renderer1-facet-space.R and test-renderer1-facet-trivial.R

tests/testthat/test-compiler-multiline-text.R

Changed all jsonlite::fromJSON() calls to RJSONIO::fromJSON(). Removed insufficient axis title size tests. Added renderer test verifying multiline text with large font does not overlap plot area (as requested).

tests/testthat/test-renderer1-multiline-spacing.R

tdhock · 2025-11-14T14:12:40Z

please click Resolve conversation so reviewers can see which things you have already fixed.

codecov · 2025-11-27T17:02:56Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 72.97%. Comparing base (a444f7b) to head (acbc6da).

Additional details and impacted files

@@            Coverage Diff             @@
##           master     #261      +/-   ##
==========================================
+ Coverage   72.77%   72.97%   +0.20%     
==========================================
  Files         164      165       +1     
  Lines        8805     8871      +66     
==========================================
+ Hits         6408     6474      +66     
  Misses       2397     2397

Flag	Coverage Δ
javascript	`80.11% <100.00%> (+0.39%)`	⬆️
r	`69.58% <100.00%> (+0.05%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

tdhock · 2025-11-27T18:43:14Z

please post updated screenshot

ANAMASGARD · 2025-11-28T15:47:06Z

Updated screenshot showing multiline text support working correctly:

3-line plot title does not overlap plot area
X/Y axis titles with consistent multiline spacing
Legend title with multiline support
geom_text labels with multiline text

tdhock · 2025-11-28T16:31:40Z

this looks better.
like I wrote before #261 (comment) there is still the inconsistency between the amount of white space in X and Y axes. (Y has no space but X space is large)
please fix so that they are more consistent.

ANAMASGARD added 2 commits October 21, 2025 21:31

add tests for multiline text support

77dd60b

Tests check that \n converts to in: - plot titles (ggtitle) - axis titles (xlab/ylab) - legend titles - geom_text labels Currently fail since feature not implemented. Addresses #221

ANAMASGARD requested a review from tdhock October 21, 2025 16:23

ANAMASGARD mentioned this pull request Oct 21, 2025

line breaks in various text elements #221

Open

tdhock requested changes Oct 21, 2025

View reviewed changes

ANAMASGARD and others added 3 commits October 22, 2025 14:30

Merge branch 'master' into multiline-text-support-221

34a76b0

add tests for multiline text spacing bugs

f7ccfc6

Tests check: - plot title doesn't overlap with plot area - x-axis and y-axis spacing is consistent - multiline spacing matches single-line baseline Tests currently fail, demonstrating the bugs in current code. Addresses feedback on PR #261.

fix multiline text spacing bugs

fdb0ddc

Two fixes: 1. Add 5px margin below title to prevent overlap with plot area 2. Use same base spacing (30px) for both X and Y axis labels Both axes now have consistent spacing, and multiline titles stay above the plot area. Addresses feedback on PR #261.

ANAMASGARD requested a review from tdhock October 22, 2025 13:58

tdhock reviewed Oct 22, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

tdhock requested changes Oct 22, 2025

View reviewed changes

ANAMASGARD and others added 2 commits October 22, 2025 21:32

simplify text measurement and remove magic numbers

9d4e1ba

- removed hardcoded -1000 positioning - reuse setMultilineText() instead of duplicating logic - rely on getBBox() for accurate measurements fixes spacing issues

Merge branch 'master' into multiline-text-support-221

1e06e57

ANAMASGARD requested a review from tdhock October 22, 2025 16:22

tdhock requested changes Oct 22, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

ANAMASGARD and others added 5 commits October 23, 2025 12:58

Resolve NEWS.md merge conflict - keep both PR#266 and PR#221 entries

6452fef

Merge branch 'multiline-text-support-221' of https://github.com/animi…

306df14

…nt/animint2 into multiline-text-support-221

Merge branch 'master' into multiline-text-support-221

f3e758c

Simplify multiline text rendering - remove redundant if-else pattern

fbfb3aa

Merge branch 'multiline-text-support-221' of https://github.com/animi…

50530fb

…nt/animint2 into multiline-text-support-221

ANAMASGARD requested a review from tdhock October 23, 2025 12:38

tdhock reviewed Oct 23, 2025

View reviewed changes

tests/testthat/test-multiline-spacing.R Outdated Show resolved Hide resolved

Remove unnecessary blank lines from test-multiline-spacing.R

400e49c

fix: axis titles now scale with theme text size

1ead178

Axis titles were stuck at 16px even when theme(text=element_text(size=30)) was set. Now they properly inherit the size from theme settings. I saw your #64 coment

ANAMASGARD added 2 commits November 7, 2025 13:03

docs: add NEWS entry for PR#261 fixes

ee37e3a

Document multiline text spacing fixes and axis title font-size scaling fix in NEWS.md

tdhock reviewed Nov 7, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

tdhock reviewed Nov 7, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

tdhock reviewed Nov 7, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

tdhock reviewed Nov 7, 2025

View reviewed changes

inst/htmljs/animint.js Outdated Show resolved Hide resolved

tdhock requested changes Nov 7, 2025

View reviewed changes

ANAMASGARD and others added 2 commits November 7, 2025 21:50

style: fix indentation and document lineHeight

f766f9c

- Use 2-space indentation consistently - Remove extra blank lines in functions - Document 1.2 lineHeight magic number - Keep .each() for D3 element selection

Merge branch 'master' into multiline-text-support-221

a3c633c

ANAMASGARD requested a review from tdhock November 7, 2025 16:32

ANAMASGARD added 2 commits November 8, 2025 20:33

tdhock requested changes Nov 11, 2025

View reviewed changes

tests/testthat/test-compiler-multiline-text.R Outdated Show resolved Hide resolved

tests/testthat/test-compiler-multiline-text.R Outdated Show resolved Hide resolved

Replace jsonlite with RJSONIO and add multiline spacing test

300537c

Changed all jsonlite::fromJSON() calls to RJSONIO::fromJSON(). Removed insufficient axis title size tests. Added renderer test verifying multiline text with large font does not overlap plot area (as requested).

ANAMASGARD requested a review from tdhock November 11, 2025 16:44

tdhock reviewed Nov 11, 2025

View reviewed changes

tests/testthat/test-renderer1-multiline-spacing.R Outdated Show resolved Hide resolved

ANAMASGARD requested a review from tdhock November 12, 2025 07:29

ANAMASGARD and others added 3 commits November 21, 2025 21:04

Merge branch 'master' into multiline-text-support-221

2b1a3cf

fix: use correct get_element_bbox signature in multiline tests

0f960ca

fix label=0 rendering and title positioning

acbc6da

Added tests for multiline text support #261

Are you sure you want to change the base?

Added tests for multiline text support #261

Uh oh!

Conversation

ANAMASGARD commented Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ANAMASGARD commented Oct 21, 2025

Add Multi-line Text Support Throughout animint2

Summary

What Now Works

Visual Verification

Example Usage

Uh oh!

tdhock commented Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ANAMASGARD commented Oct 21, 2025

Uh oh!

tdhock commented Oct 21, 2025

Uh oh!

tdhock commented Oct 21, 2025

Uh oh!

tdhock commented Oct 21, 2025

Uh oh!

tdhock left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

tdhock left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

tdhock commented Oct 23, 2025

Uh oh!

ANAMASGARD commented Nov 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ANAMASGARD commented Nov 7, 2025

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

tdhock left a comment

Choose a reason for hiding this comment

Uh oh!

ANAMASGARD commented Nov 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

tdhock commented Nov 8, 2025

Uh oh!

Uh oh!

Uh oh!

Uh oh!

tdhock commented Nov 14, 2025

Uh oh!

codecov bot commented Nov 27, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

tdhock commented Nov 27, 2025

Uh oh!

ANAMASGARD commented Nov 28, 2025

Uh oh!

tdhock commented Nov 28, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ANAMASGARD commented Oct 21, 2025 •

edited

Loading

tdhock commented Oct 21, 2025 •

edited

Loading

ANAMASGARD commented Nov 7, 2025 •

edited

Loading

ANAMASGARD commented Nov 7, 2025 •

edited

Loading

codecov bot commented Nov 27, 2025 •

edited

Loading