COMPLETES

https://jira-eng-sjc12.cisco.com/jira/browse/CAI-6890

This pull request addresses

Widgets currently record mount and unmount events but do not track when important props change. This makes it harder to monitor widget behavior and debug issues related to prop updates.

by making the following changes

• Added optional propsToWatch parameter to withMetrics() HOC in @webex/cc-ui-logging
• When propsToWatch is provided, the HOC tracks previous values of watched props using useRef
• On re-render, if any watched prop has changed (shallow comparison via existing havePropsChanged), a PROPS_UPDATED event is logged with only the watched props in the payload
• Initial render does not trigger PROPS_UPDATED (only subsequent changes)
• Unwatched props (like timers) are excluded from logging to avoid log pollution
• Added 5 unit tests covering: watched prop change logging, unwatched prop filtering, no-watch passthrough, initial render skip, and payload correctness
• 100% code coverage on withMetrics.tsx

Usage by components (follow-up): Each component can now pass a propsToWatch array:

const WrappedComponent = withMetrics(MyComponent, 'MyWidget', ['importantProp', 'anotherProp']);

Change Type

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Documentation update
• Tooling change
• Internal code refactor

The following scenarios were tested

• The testing is done with the amplify link
• Unit tests added/updated and passing (18 tests, all passing)
• PROPS_UPDATED logged when watched props change
• PROPS_UPDATED NOT logged when only unwatched props change
• PROPS_UPDATED NOT logged on initial render
• Only watched props included in log payload
• Backward compatible — existing withMetrics calls work without propsToWatch

The GAI Coding Policy And Copyright Annotation Best Practices

• GAI was not used (or, no additional notation is required)
• Code was generated entirely by GAI
• GAI was used to create a draft that was subsequently customized or modified
• Coder created a draft manually that was non-substantively modified by GAI (e.g., refactoring was performed by GAI on manually written code)
• Tool used for AI assistance (GitHub Copilot / Other - specify)
  • Github Copilot
  • Other - Claude Code
• This PR is related to
  • Feature
  • Defect fix
  • Tech Debt
  • Automation

Checklist before merging

• I have not skipped any automated checks
• All existing and new tests passed
• I have updated the testing document
• I have tested the functionality with amplify link

Make sure to have followed the contributing guidelines before submitting.