How to test CSS properties defined inside a class with react testing library

I am trying to test CSS properties that i have defined inside a class in css, wing the react testing library. However I am unable to do so.

Adding the simplified snippets.

import React from "react";
import { render, screen } from "@testing-library/react";
import '@testing-library/jest-dom/extend-expect';
import styled from "styled-components";

const Title = styled.span`
    display: none;
    background: red;
`

test("testRender", () => {

    render(
        <div>
            <Title>Test</Title>
        </div>
    )

    const spanElement = screen.getByText("Test");
    const elementStyle = window.getComputedStyle(spanElement);
    expect(elementStyle.display).toBe('none');
});

The test fails at the expect statement. I have tried refactoring to traditional css, there also the test fails. In both cases, I have tested it manually and the styles are taking effect.

I also understand that we should not directly test CSS properties, but I have tried testing the visibility with toBeVisible(), but that only works if the display: none is directly entered as a style, and not as part of a class.

This should be a very simple thing, that works out of the box, but I have been at it for some time now, without any luck.

Any help is appreciated.