SBC Common Components: external import can cause test failures

The Sbc Header component uses another component named Notification Panel, which imports and uses an external library named "clickout-event".

This external library causes unit test errors if concurrent tests render the SBC Header component (eg, multiple test files mount App.vue). Ie:


The author tried to work around this by mocking Sbc Header (so it wouldn't be rendered) but this didn't work. Instead, unit tests had to be moved to a single unit test file, in which describe blocks are run consecutively.

This issue may bite someone else in the future. I recommend looking for a better-implemented library to handle clickout events.

cc: @pwei1018 @seeker25

Start by reproducing the unit-test failure with concurrent mounts of App.vue, then trace the SBC Header to Notification Panel and its clickout-event import. Compare how the external library behaves across concurrent tests and evaluate a replacement or integration change. Done means concurrent SBC Header tests run without failures and no longer need to be consolidated into one file.

Written by the indexing model from the issue text.