import { test } from 'magnitude-test';

test('Mantine theme is applied correctly', async (agent) => {
  // Act: Navigate to the homepage
  await agent.act('Navigate to the homepage');

  // Check: Verify the Mantine components are rendered
  await agent.check('The text "Ponderants" is visible as a title');
  await agent.check('A "Test Button" is visible on the screen');

  // Check: Verify the theme is applied.
  // We check that the page uses a dark background with grayscale styling
  await agent.check(
    'The page has a dark background with light text, consistent with a grayscale dark theme'
  );

  // Check: Verify the Paper component is rendered with its themed styles
  await agent.check(
    'The page content is inside a "Paper" component with a border'
  );
});