[UIK-3788]/unit tests

semcore/base-components/__tests__/Grid.test.jsx

@@ -1,17 +1,22 @@
-import * as sharedTests from '@semcore/testing-utils/shared-tests';
+import { runComponentContractTests } from '@semcore/testing-utils/shared-tests';
 import { cleanup } from '@semcore/testing-utils/testing-library';
 import { describe, beforeEach } from '@semcore/testing-utils/vitest';
-import React from 'react';
 
 import { Col, Row } from '../src';
 
-const { shouldSupportClassName, shouldSupportRef } = sharedTests;
-
 describe('Grid', () => {
   beforeEach(cleanup);
-  shouldSupportClassName(Row);
-  shouldSupportRef(Row);
 
-  shouldSupportClassName(Col, Row);
-  shouldSupportRef(Col, Row);
+  runComponentContractTests({
+    Component: Row,
+    expectedDataUiName: 'Row',
+    preset: 'root',
+  });
+
+  runComponentContractTests({
+    Component: Col,
+    Wrapper: Row,
+    expectedDataUiName: 'Row.Col',
+    preset: 'root',
+  });
 });

semcore/base-components/__tests__/flex-box.test.jsx

@@ -1,17 +1,22 @@
-import * as sharedTests from '@semcore/testing-utils/shared-tests';
+import { runComponentContractTests } from '@semcore/testing-utils/shared-tests';
 import { cleanup, render } from '@semcore/testing-utils/testing-library';
 import { expect, test, describe, beforeEach } from '@semcore/testing-utils/vitest';
 import React from 'react';
 
 import { Box, Flex } from '../src';
 
-const { shouldSupportClassName, shouldSupportRef } = sharedTests;
+const SpanTag = function SpanTag(props) {
+  return <span {...props} />;
+};
 
 describe('Flex', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(Flex);
-  shouldSupportRef(Flex);
+  runComponentContractTests({
+    Component: Flex,
+    expectedDataUiName: 'Flex',
+    preset: 'root',
+  });
 
   test.concurrent('Verify supports css property', async () => {
     const MAP_CSS = {
@@ -80,28 +85,15 @@ describe('Flex', () => {
 describe('Box', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(Box);
-  shouldSupportRef(Box);
-
-  test('Verify \'tag\' prop', () => {
-    const { getByTestId } = render(
-      <Box tag='span' data-testid='box'>
-        tag
-      </Box>,
-    );
-    expect(getByTestId('box').tagName).toBe('SPAN');
-  });
-
-  test('Verify \'tag\' prop component', () => {
-    const Span = function (props) {
-      return <span {...props} />;
-    };
-    const { getByTestId } = render(
-      <Box tag={Span} data-testid='box'>
-        tag
-      </Box>,
-    );
-    expect(getByTestId('box').tagName).toBe('SPAN');
+  runComponentContractTests({
+    Component: Box,
+    expectedDataUiName: 'Box',
+    preset: 'root',
+    include: ['tag'],
+    tagCases: [
+      { tag: 'button', expectedTagName: 'BUTTON' },
+      { tag: SpanTag, name: 'SpanTag', expectedTagName: 'SPAN' },
+    ],
   });
 
   test('Verify clear non html props', () => {

semcore/base-components/__tests__/scroll-area.test.tsx

@@ -1,12 +1,10 @@
-import * as sharedTests from '@semcore/testing-utils/shared-tests';
+import { runComponentContractTests } from '@semcore/testing-utils/shared-tests';
 import { cleanup, render, fireEvent, waitFor } from '@semcore/testing-utils/testing-library';
 import { expect, test, describe, beforeEach, vi } from '@semcore/testing-utils/vitest';
 import React from 'react';
 
 import { ScrollArea, eventCalculate } from '../src';
 
-const { shouldSupportClassName, shouldSupportRef } = sharedTests;
-
 describe('ScrollArea', () => {
   beforeEach(cleanup);
 
@@ -25,8 +23,11 @@ describe('ScrollArea', () => {
     ).toBe(1);
   });
 
-  shouldSupportClassName(ScrollArea);
-  shouldSupportRef(ScrollArea);
+  runComponentContractTests({
+    Component: ScrollArea,
+    expectedDataUiName: 'ScrollArea',
+    preset: 'root',
+  });
 
   test.concurrent('Verify trigger calculate event on container', () => {
     const { getByTestId } = render(
@@ -84,6 +85,10 @@ describe('ScrollArea', () => {
 describe('ScrollArea.Container', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(ScrollArea.Container, ScrollArea);
-  shouldSupportRef(ScrollArea.Container, ScrollArea);
+  runComponentContractTests({
+    Component: ScrollArea.Container,
+    Wrapper: ScrollArea,
+    expectedDataUiName: 'ScrollArea.Container',
+    preset: 'root',
+  });
 });

semcore/base-trigger/__tests__/index.test.tsx

@@ -1,5 +1,4 @@
-import * as sharedTests from '@semcore/testing-utils/shared-tests';
-import { runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
+import { runComponentContractTests, runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
 import { cleanup, render, userEvent } from '@semcore/testing-utils/testing-library';
 import { expect, test, describe, beforeEach } from '@semcore/testing-utils/vitest';
 import React from 'react';
@@ -10,20 +9,24 @@ describe('BaseTrigger Dependency imports', () => {
   runDependencyCheckTests('base-trigger');
 });
 
-const { shouldSupportClassName, shouldSupportRef } = sharedTests;
-
 describe('BaseTrigger', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(BaseTrigger);
-  shouldSupportRef(BaseTrigger);
+  runComponentContractTests({
+    Component: BaseTrigger,
+    expectedDataUiName: 'BaseTrigger',
+    preset: 'root',
+  });
 });
 
 describe('ButtonTrigger', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(ButtonTrigger);
-  shouldSupportRef(ButtonTrigger);
+  runComponentContractTests({
+    Component: ButtonTrigger,
+    expectedDataUiName: 'ButtonTrigger',
+    preset: 'root',
+  });
 
   test.concurrent('Should work as button with labels', async () => {
     const component = (
@@ -46,13 +49,20 @@ describe('ButtonTrigger', () => {
 describe('FilterTrigger', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(FilterTrigger);
-  shouldSupportRef(FilterTrigger);
+  runComponentContractTests({
+    Component: FilterTrigger,
+    expectedDataUiName: 'FilterTrigger',
+    preset: 'root',
+  });
 });
 
 describe('LinkTrigger', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(LinkTrigger);
-  shouldSupportRef(LinkTrigger);
+  runComponentContractTests({
+    Component: LinkTrigger,
+    props: { children: 'Link trigger' },
+    expectedDataUiName: 'LinkTrigger',
+    preset: 'root',
+  });
 });

semcore/button/__tests__/index.test.tsx

@@ -1,15 +1,51 @@
-import { runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
-import { render } from '@semcore/testing-utils/testing-library';
-import { expect, test, describe } from '@semcore/testing-utils/vitest';
+import Link from '@semcore/link';
+import { runComponentContractTests, runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
+import { cleanup, render } from '@semcore/testing-utils/testing-library';
+import { beforeEach, expect, test, describe } from '@semcore/testing-utils/vitest';
 import React from 'react';
 
-import Button from '../src';
+import Button, { ButtonLink } from '../src';
 
 describe('Button Dependency imports', () => {
   runDependencyCheckTests('button');
 });
 
 describe('Button', () => {
+  beforeEach(cleanup);
+
+  runComponentContractTests({
+    Component: Button,
+    props: { children: 'Button' },
+    expectedDataUiName: 'Button',
+    preset: ['root', 'interactive'],
+    include: ['tag'],
+    tagCases: [
+      { tag: 'a', expectedTagName: 'A', props: { href: '#' } },
+      { tag: Link, name: 'Link', expectedTagName: 'A', props: { href: '#' } },
+    ],
+  });
+
+  runComponentContractTests({
+    Component: Button.Text,
+    props: { children: 'Button text' },
+    expectedDataUiName: 'Button.Text',
+    preset: 'root',
+  });
+
+  runComponentContractTests({
+    Component: Button.Addon,
+    props: { children: <span>Addon</span> },
+    expectedDataUiName: 'Button.Addon',
+    preset: 'root',
+  });
+
+  runComponentContractTests({
+    Component: ButtonLink,
+    props: { children: 'ButtonLink' },
+    expectedDataUiName: 'ButtonLink',
+    preset: 'root',
+  });
+
   test('Verify loading attributes', () => {
     const { queryByTestId } = render(
       <Button data-testid='button' loading>
@@ -20,7 +56,7 @@ describe('Button', () => {
     expect(queryByTestId('button')?.querySelectorAll('[data-ui-name="Spin"]')).toHaveLength(1);
   });
 
-  test.concurrent('Verify aria-busy when loading', () => {
+  test('Verify aria-busy when loading', () => {
     const { queryByTestId } = render(
       <Button data-testid='busy-button' loading>
         Text

semcore/card/__tests__/index.test.tsx

@@ -1,25 +1,33 @@
-import * as sharedTests from '@semcore/testing-utils/shared-tests';
-import { runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
+import { runComponentContractTests, runDependencyCheckTests } from '@semcore/testing-utils/shared-tests';
 import { cleanup } from '@semcore/testing-utils/testing-library';
 import { describe, beforeEach } from '@semcore/testing-utils/vitest';
 
 import Card from '../src';
 
-const { shouldSupportClassName, shouldSupportRef } = sharedTests;
-
 describe('Card Dependency imports', () => {
   runDependencyCheckTests('card');
 });
 
 describe('Card', () => {
   beforeEach(cleanup);
 
-  shouldSupportClassName(Card);
-  shouldSupportRef(Card);
+  runComponentContractTests({
+    Component: Card,
+    expectedDataUiName: 'Card',
+    preset: 'root',
+  });
 
-  shouldSupportClassName(Card.Title, Card);
-  shouldSupportRef(Card.Title, Card);
+  runComponentContractTests({
+    Component: Card.Title,
+    Wrapper: Card,
+    expectedDataUiName: 'Card.Title',
+    preset: 'root',
+  });
 
-  shouldSupportClassName(Card.Description, Card);
-  shouldSupportRef(Card.Description, Card);
+  runComponentContractTests({
+    Component: Card.Description,
+    Wrapper: Card,
+    expectedDataUiName: 'Card.Description',
+    preset: 'root',
+  });
 });