Touch area for remove buttons too small

[Nancy-Salpepi]

Test device MacBook Air (m1 chip)

Operating System 12.6

Browser safari/chrome

Problem description For https://github.com/phetsims/qa/issues/844 and https://github.com/phetsims/qa/issues/845, the pointer areas for the remove buttons are much smaller in 1.5.0-dev.2 than in the published version.

Visuals

Troubleshooting information: !!!!! DO NOT EDIT !!!!! Name: ‪Molecule Shapes‬ URL: https://phet-dev.colorado.edu/html/molecule-shapes/1.5.0-dev.4/phet/molecule-shapes_all_phet.html?showPointerAreas Version: 1.5.0-dev.4 2022-10-20 17:35:25 UTC Features missing: applicationcache, applicationcache, touch Flags: pixelRatioScaling User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36 Language: en-US Window: 1846x985 Pixel Ratio: 1.3333333730697632/1 WebGL: WebGL 1.0 (OpenGL ES 2.0 Chromium) GLSL: WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium) Vendor: WebKit (WebKit WebGL) Vertex: attribs: 16 varying: 31 uniform: 1024 Texture: size: 16384 imageUnits: 16 (vertex: 16, combined: 32) Max viewport: 16384x16384 OES_texture_float: true Dependencies JSON: {}

[KatieWoe]

I noticed this on iPad, the buttons were noticeably harder to use than in published. It also applied to the lone pairs.

[samreid]

I'll take a look at this one...

[samreid]

I added a fix/workaround for this case. The touch area was already being set, but it seemed disrupted when added to an HBox. Perhaps HBoxes now change pointer areas for their child nodes. Anyways, this issue can be tested by @arouinfar or @KatieWoe, and I'm not sure if it needs code review or a common code issue.

[KatieWoe]

Looks good on master

[samreid]

OK back to @jonathanolson to see if we need to make another issue about HBox altering pointer areas.

[jonathanolson]

Handled above, thanks!