CSE Machine: Fix some UI & animations issues, and add tests

[CZX123]

Description

This PR fixes some UI & animations issues, and add some tests for the CSE machine's layout and animations. Fixes #2921 fully by correctly calculating the width of the frame with a rune. Fixes #2959. Fixes #2716. The new result is shown below:

Changes

UI

• [X] Improved environment frame positioning, spacing is now more consistent.
• [X] Global frame default text of :::pre-declared names::: now should appear first, above all bindings
• [X] Arrows from arrays now always exit the array first before pointing to their targets.
  • If the arrow comes from the first unit of the array to itself, it will now form a circular loop
• [X] Changed height and width behavior for array and function values
  • _height and _width now only refer to the height and widths of the array boxes or closure circles only
  • ArrayValue now has a totalHeight and totalWidth property that stores the total height and width of nested values inside the array
  • FnValue and GlobalFnValue has a totalWidth property that also includes the tooltip width
• [X] Double quotes are used for strings in the stash now.

Animations

• [X] Fixed frame arrows not animating alongside the frame creation in FrameCreationAnimation
• [X] Fixed the animation function inside BaseAnimationComponent, so that the example below has the correct expected behavior:

  a.animateTo({ x: 100 });
  a.animateTo({ x: 200 }, { delay: 1 });

Testing

• [X] Add test cases for the CSE machine's layout for values
• [X] Add test cases for the CSE machine's AnimationComponent

[coveralls]

Pull Request Test Coverage Report for Build 10003925618

Details

• 66 of 89 (74.16%) changed or added relevant lines in 16 files are covered.
• 8 unchanged lines in 4 files lost coverage.
• Overall coverage increased (+0.6%) to 32.067%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
src/features/cseMachine/tests/snapshots/CseMachineAnimation.tsx.snap	0	1	0.0%
src/features/cseMachine/components/ControlItemComponent.tsx	1	2	50.0%
src/features/cseMachine/components/StashItemComponent.tsx	1	2	50.0%
src/features/cseMachine/CseMachineUtils.ts	3	5	60.0%
src/features/cseMachine/components/Frame.tsx	20	22	90.91%
src/features/cseMachine/animationComponents/FrameCreationAnimation.tsx	0	4	0.0%
src/features/cseMachine/CseMachineAnimation.tsx	1	7	14.29%
src/features/cseMachine/CseMachineLayout.tsx	5	11	45.45%
<!--	Total:	66	89	74.16%	-->

Files with Coverage Reduction	New Missed Lines	%
src/features/cseMachine/CseMachineAnimation.tsx	1	14.29%
src/features/cseMachine/CseMachineLayout.tsx	2	63.61%
src/features/cseMachine/animationComponents/FrameCreationAnimation.tsx	2	0.0%
src/features/cseMachine/CseMachineUtils.ts	3	69.03%
<!--	Total:	8		-->

Totals
Change from base Build 9984069378:	0.6%
Covered Lines:	4979
Relevant Lines:	14679

---

💛 - Coveralls