I have several components where I added a analyticsProvider to track usage. In each one of these, I'm using an useEffect hook and importing useAnalytics:
import { useAnalytics } from '@framework/component-analytics';
const { trackView } = useAnalytics();
useEffect(() => {
trackView(`/liveTraffic`, 'liveTrafficPage');
}, [trackView]);
I also have a AnalyticsProvider at the root of the application that passes all the necessary config to the child consumers (ie. useAnalytics).
I'm running into an issue when running tests: 'useAnalytics' must be called from inside an '<AnalyticsProvider>', or must be provided with an 'eventManagerConfiguration' argument.
What is the best way to pass the component needed and related configuration in my tests? I'm fairly new to React and struggling to figure out what to use. I've looked into wrapping the components but it's not working.
describe('has no liveTraffic list items', () => {
const component = shallow(analyticsWrapper(<LiveTrafficPage {...props} />));
it('should NOT render LiveTrafficListing', () => {
expect(component.update().find(LiveTrafficListing).length).toEqual(0);
});
});