"TypeError: Cannot read properties of undefined (reading 'name')" on my node_modules file

Question

I'm working on a solid-js project. For some time now, none of the buttons in my application react when clicked. Although I did not make any code changes before the bug appeared. To fix this issue related to my buttons, I deleted then reinstalled my node_modules folder, shut down then restarted my computer, updated my library dependencies. But none of these attempts solved my problem. So I performed tests on one of my buttons. None returned a positive result and I get the same error on both my tests. There she is:

TypeError: Cannot read properties of undefined (reading 'name')
 ❯ devComponent node_modules/.pnpm/[email protected]/node_modules/solid-js/dist/dev.js:543:26
    541|   c.observerSlots = null;
    542|   c.state = 0;
    543|   c.componentName = Comp.name;
       |                          ^
    544|   updateComputation(c);
    545|   return c.tValue !== undefined ? c.tValue : c.value;

This error comes from a file contained in my folder node_modules as specified on the error message. I don't know why I am getting this error yet I have updated all my library dependencies to the latest version. Here is a snippet of my dev.js file where the error is coming from, it is contained in my node_modules folder:

function devComponent(Comp, props) {
  const c = createComputation(() => untrack(() => {
    Object.assign(Comp, {
      [$DEVCOMP]: true
    });
    return Comp(props);
  }), undefined, true);
  c.pending = NOTPENDING;
  c.observers = null;
  c.observerSlots = null;
  c.state = 0;
  c.componentName = Comp.name;
  updateComputation(c);
  return c.tValue !== undefined ? c.tValue : c.value;
}

Here is the content of my test file:

import { screen, render, fireEvent } from 'solid-testing-library';
import { describe, expect,it ,  test } from 'vitest';
import { Messenger } from '../components/header/Messenger';


describe('<Messenger />', () => {
  it('create an instance', async () => {
  const { component } = render(() => <Messenger />);
  expect(await screen.findByRole('button', { name: 'Click me!' }));
  expect(component).toBeInTheDocument();
  });


  it('This changes text on click',async () => {
    const { component } = render(() => <Messenger />);
    expect(component).toBeInTheDocument();
    fireEvent.click(component);
    expect(await screen.findByRole('button', { name: 'Test this!' })).toBeInTheDocument();
    });
  
})

I use vitest for my tests and the component file to test is here:

import { Link } from "solid-app-router";
import { SiMessenger } from "solid-icons/si";
import { createResource, createSignal, Match, Show, Switch } from "solid-js";

export default function Messenger() {
  const [clicked, setClicked] = createSignal(false);
  const [resource] = createResource(fetchMessenger);

  function toggle() {
    setOpen((o) => !o);
  }

  return (
    <>
      <button
        onClick={() => setClicked(true)}
        className="block p-2 md:p-3 rounded-full bg-gray-200 hover:bg-gray-300 dark:bg-gray-700 dark:hover:bg-gray-600  text-black dark:text-white "
      >
        <SiMessenger className="text-xl" />
      </button>
      {clicked() ? 'Test this!' : 'Click me!'}

I don't know how to solve this problem.