I am using "nativewind": "^4.1.23" in "expo": "~52.0.31", I have a simple component which uses className styling and the styles are applied as expected:

const FAB: React.FC<FABProps> = ({ style = "Surface", onPress, iconName }) => {
  const getStyleClass = () => {
    switch (style) {
      case "Primary":
        return "bg-primary";
      case "Secondary":
        return "bg-secondary";
      case "Tertiary":
        return "bg-tertiary";
      default:
        return "bg-surface";
    }
  };

  return (
    <TouchableOpacity
      onPress={onPress}
      className={`w-14 h-14 rounded-full shadow-lg ${getStyleClass()}`}
      testID="fab-button"
    >
      <View className="flex-1 justify-center items-center">
        <Icon name={iconName} size={24} />
      </View>
    </TouchableOpacity>
  );
};

When I am trying to test it using jest:

import React from "react";
import { render } from "@utils/test-utils";
import FAB from "./Fab";

describe("FAB Component", () => {
  it("renders correctly with default style", async () => {
    const { getByTestId } = await render(
      <FAB onPress={() => {}} iconName="menu" />,
    );
    const fabButton = getByTestId("fab-button");
    console.log("fabButton.props", fabButton.props);
    expect(fabButton.props.className).toContain("bg-surface");
  });
});

fabButton.props.className is always undefined. Should I do any additional setup to get the className when running jest?

fabButton.props.className should have the classNames assigned