bug: Using store prevents stencil test from being run

[pimmesz]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Stencil Store Version

2.0.9

Stencil Version

4.0.2

Current Behavior

I have implemented a basic store in a stencil test project. Whenever I try to set store values en reset them in my test; the test loses the context and cannot find the component anymore. If I run a single test instead of both, it does not have any issue.

my-component.tsx

import { Component, State, h } from '@stencil/core';
import { store, onStoreChange } from '../../store/store';

@Component({
  tag: 'my-component',
  styleUrl: 'my-component.css',
  shadow: true,
})
export class MyComponent {
  @State() test = true;

  setTestState() {
    this.test = !this.test;
  }

  componentWillLoad() {
    onStoreChange('isActive', this.setTestState.bind(this));
  }

  render() {
    return <div>Hello, World! I'm</div>;
  }
}

my-component.spec.ts

import { newSpecPage } from '@stencil/core/testing';
import { MyComponent } from './my-component';
import { store } from '../../store/store';

describe('my-component', () => {
   afterEach(() => {
    store.dispose();
  });

  it('renders', async () => {
    const { root } = await newSpecPage({
      components: [MyComponent],
      html: '<my-component></my-component>',
    });

    store.state.isActive = false;

    expect(root).toEqualHtml(`
      <my-component>
        <mock:shadow-root>
          <div>
            Hello, World! I'm
          </div>
        </mock:shadow-root>
      </my-component>
    `);
  });
  
  it('renders', async () => {
    const { root } = await newSpecPage({
      components: [MyComponent],
      html: '<my-component></my-component>',
    });

    store.state.isActive = false;

    expect(root).toEqualHtml(`
      <my-component>
        <mock:shadow-root>
          <div>
            Hello, World! I'm
          </div>
        </mock:shadow-root>
      </my-component>
    `);
  });
});

store.ts

import { createStore } from '@stencil/store';

export interface StoreState {
  isActive: boolean;
}

const store = createStore<StoreState>({
  isActive: true
});

const onStoreChange = (key: keyof StoreState, cb: (value: string | boolean) => void): void => {
  store.onChange(key, (value: any) => {
    cb(value);
  });
};

export { store, onStoreChange };

Current error
TypeError: Cannot read properties of undefined (reading '$instanceValues$')

Expected Behavior

Run both tests without any issues.

Steps to Reproduce

With the code provided in the Current behavior box the failure could be reproduced.

Code Reproduction URL

https://github.com/pimmesz/stencil-test

Additional Information

No response