instrument lidHandle and resizeHandle

js/common/view/IdealGasLawContainerNode.ts

@@ -28,6 +28,7 @@ import LidNode from './LidNode.js';
 import LidHandleKeyboardDragListener from './LidHandleKeyboardDragListener.js';
 import ResizeHandleKeyboardDragListener from './ResizeHandleKeyboardDragListener.js';
 import Multilink from '../../../../axon/js/Multilink.js';
+import Tandem from '../../../../tandem/js/Tandem.js';
 
 // constants
 const LID_X_SPEED = -50; // pixels/second
@@ -85,14 +86,16 @@ export default class IdealGasLawContainerNode extends Node {
     } );
 
     // Resize handle on the left wall, wrapped in a Node so that its focus highlight is not affected by scaling.
-    const resizeHandleNode = new ResizeHandleNode( options.resizeGripColor );
+    const resizeHandleNode = new ResizeHandleNode( options.resizeGripColor, options.tandem.createTandem( 'resizeHandleNode' ) );
 
     // Lid on the top of the container
     const lidNode = new LidNode( holdConstantProperty, {
       baseWidth: modelViewTransform.modelToViewDeltaX( container.lidWidthProperty.value ),
       baseHeight: modelViewTransform.modelToViewDeltaX( container.lidThickness ),
-      gripColor: options.lidGripColor
+      gripColor: options.lidGripColor,
+      tandem: options.tandem.createTandem( 'lidNode' )
     } );
+    const lidHandleNode = lidNode.handleNode;
 
     options.children = [ previousBoundsNode, resizeHandleNode, wallsNode, lidNode ];
 
@@ -158,10 +161,10 @@ export default class IdealGasLawContainerNode extends Node {
 
     // Dragging the resize handle horizontally changes the container's width
     const resizeHandleDragListener = new ResizeHandleDragListener( container, modelViewTransform, this,
-      options.tandem.createTandem( 'resizeHandleDragListener' ) );
+      resizeHandleNode.tandem.createTandem( 'resizeHandleDragListener' ) );
     resizeHandleNode.addInputListener( resizeHandleDragListener );
     const resizeHandleKeyboardDragListener = new ResizeHandleKeyboardDragListener( container, modelViewTransform,
-      options.tandem.createTandem( 'resizeHandleKeyboardDragListener' ) );
+      resizeHandleNode.tandem.createTandem( 'resizeHandleKeyboardDragListener' ) );
     resizeHandleNode.addInputListener( resizeHandleKeyboardDragListener );
 
     // While interacting with the resize handle...
@@ -188,11 +191,11 @@ export default class IdealGasLawContainerNode extends Node {
 
     // Dragging the lid's handle horizontally changes the size of the opening in the top of the container.
     const lidHandleDragListener = new LidHandleDragListener( container, modelViewTransform, this,
-      options.tandem.createTandem( 'lidHandleDragListener' ) );
-    lidNode.handleNode.addInputListener( lidHandleDragListener );
+      lidHandleNode.tandem.createTandem( 'lidHandleDragListener' ) );
+    lidHandleNode.addInputListener( lidHandleDragListener );
     const lidHandleKeyboardDragListener = new LidHandleKeyboardDragListener( container, modelViewTransform,
-      options.tandem.createTandem( 'lidHandleKeyboardDragListener' ) );
-    lidNode.handleNode.addInputListener( lidHandleKeyboardDragListener );
+      lidHandleNode.tandem.createTandem( 'lidHandleKeyboardDragListener' ) );
+    lidHandleNode.addInputListener( lidHandleKeyboardDragListener );
 
     // This implementation assumes that the lid is not interactive while the container is being resized. This is
     // handled in resizeHandlePressedListener above. The lid will behave badly if this is not the case, so verify.
@@ -264,7 +267,7 @@ export default class IdealGasLawContainerNode extends Node {
  */
 class ResizeHandleNode extends InteractiveHighlighting( Node ) {
 
-  public constructor( resizeGripColor: TColor ) {
+  public constructor( resizeGripColor: TColor, tandem: Tandem ) {
     super( {
       children: [
         // Wrap HandleNode so that ResizeHandleNode's focus highlight is not affected by scaling.
@@ -277,7 +280,10 @@ class ResizeHandleNode extends InteractiveHighlighting( Node ) {
       ],
       cursor: 'pointer',
       tagName: 'div',
-      focusable: true
+      focusable: true,
+      tandem: tandem,
+      phetioVisiblePropertyInstrumented: false, // sim sets resizeHandle.visibleProperty
+      phetioInputEnabledPropertyInstrumented: true
     } );
   }
 }

js/common/view/LidNode.ts

@@ -14,6 +14,7 @@ import { InteractiveHighlighting, Node, NodeOptions, NodeTranslationOptions, Rec
 import gasProperties from '../../gasProperties.js';
 import GasPropertiesColors from '../GasPropertiesColors.js';
 import { HoldConstant } from '../model/HoldConstant.js';
+import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
 
 // constants
 const HANDLE_ATTACHMENT_LINE_WIDTH = 1;
@@ -25,7 +26,7 @@ type SelfOptions = {
   gripColor?: TColor;
 };
 
-type LidNodeOptions = SelfOptions;
+type LidNodeOptions = SelfOptions & PickRequired<NodeOptions, 'tandem'>;
 
 export default class LidNode extends Node {
 
@@ -40,7 +41,8 @@ export default class LidNode extends Node {
       gripColor: GasPropertiesColors.lidGripColorProperty,
 
       // NodeOptions
-      isDisposable: false
+      isDisposable: false,
+      phetioVisiblePropertyInstrumented: false
     }, providedOptions );
 
     const baseNode = new Rectangle( 0, 0, options.baseWidth, options.baseHeight, {
@@ -49,26 +51,27 @@ export default class LidNode extends Node {
       bottom: 0
     } );
 
-    const handleNode = new LidHandleNode( options.gripColor, {
+    const lidHandleNode = new LidHandleNode( options.gripColor, {
       right: baseNode.right - HANDLE_RIGHT_INSET,
-      bottom: baseNode.top + 1
+      bottom: baseNode.top + 1,
+      tandem: options.tandem.createTandem( 'lidHandleNode' )
     } );
-    assert && assert( handleNode.width <= baseNode.width,
-      `handleNode.width ${handleNode.width} is wider than baseNode.width ${baseNode.width}` );
-    handleNode.touchArea = handleNode.localBounds.dilatedXY( 25, 20 );
+    assert && assert( lidHandleNode.width <= baseNode.width,
+      `handleNode.width ${lidHandleNode.width} is wider than baseNode.width ${baseNode.width}` );
+    lidHandleNode.touchArea = lidHandleNode.localBounds.dilatedXY( 25, 20 );
 
-    options.children = [ handleNode, baseNode ];
+    options.children = [ lidHandleNode, baseNode ];
 
     super( options );
 
     // Hide the handle when holding temperature constant.  We don't want to deal with counteracting evaporative
     // cooling, which will occur when the lid is open. See https://github.com/phetsims/gas-properties/issues/159
     holdConstantProperty.link( holdConstant => {
       this.interruptSubtreeInput();
-      handleNode.visible = ( holdConstant !== 'temperature' );
+      lidHandleNode.visible = ( holdConstant !== 'temperature' );
     } );
 
-    this.handleNode = handleNode;
+    this.handleNode = lidHandleNode;
     this.baseNode = baseNode;
   }
 
@@ -90,7 +93,7 @@ export default class LidNode extends Node {
  */
 class LidHandleNode extends InteractiveHighlighting( Node ) {
 
-  public constructor( gripColor: TColor, providedOptions?: NodeTranslationOptions ) {
+  public constructor( gripColor: TColor, providedOptions?: NodeTranslationOptions & PickRequired<NodeOptions, 'tandem'> ) {
     super( combineOptions<NodeOptions>( {
       children: [
         // Wrap HandleNode so that LidHandleNode's focus highlight is not affected by scaling.
@@ -103,7 +106,9 @@ class LidHandleNode extends InteractiveHighlighting( Node ) {
       ],
       cursor: 'pointer',
       tagName: 'div',
-      focusable: true
+      focusable: true,
+      phetioVisiblePropertyInstrumented: false, // sim sets lidHandleNode.visibleProperty
+      phetioInputEnabledPropertyInstrumented: true
     }, providedOptions ) );
   }
 }