Kaynağa Gözat

Update button tests

Adjust tests for icons.
master
TheoryOfNekomata 9 ay önce
ebeveyn
işleme
67e987648c
4 değiştirilmiş dosya ile 48 ekleme ve 11 silme
  1. +23
    -0
      categories/web/action/react/src/components/ActionButton/ActionButton.test.tsx
  2. +1
    -0
      categories/web/action/react/src/components/ActionButton/index.tsx
  3. +23
    -11
      categories/web/navigation/react/src/components/LinkButton/LinkButton.test.tsx
  4. +1
    -0
      categories/web/navigation/react/src/components/LinkButton/index.tsx

+ 23
- 0
categories/web/action/react/src/components/ActionButton/ActionButton.test.tsx Dosyayı Görüntüle

@@ -93,6 +93,29 @@ describe('ActionButton', () => {
expect(button).toHaveClass('pl-2 gap-2 pr-2'); expect(button).toHaveClass('pl-2 gap-2 pr-2');
}); });


it('renders an icon', () => {
render(
<ActionButton
icon={<span />}
/>,
);

const icon = screen.getByTestId('icon');
expect(icon).toBeInTheDocument();
});

it('renders icon after children', () => {
render(
<ActionButton
iconAfterChildren
icon={<div />}
/>,
);

const childrenParent = screen.getByTestId('childrenParent');
expect(childrenParent).toHaveClass('flex-row-reverse');
});

describe.each` describe.each`
size | className size | className
${'small'} | ${'h-10'} ${'small'} | ${'h-10'}


+ 1
- 0
categories/web/action/react/src/components/ActionButton/index.tsx Dosyayı Görüntüle

@@ -110,6 +110,7 @@ export const ActionButton = React.forwardRef<ActionButtonDerivedElement, ActionB
)} )}
> >
<span <span
data-testid="childrenParent"
className={clsx( className={clsx(
'flex-auto min-w-0 flex items-center gap-2', 'flex-auto min-w-0 flex items-center gap-2',
iconAfterChildren ? 'flex-row-reverse' : 'flex-row', iconAfterChildren ? 'flex-row-reverse' : 'flex-row',


+ 23
- 11
categories/web/navigation/react/src/components/LinkButton/LinkButton.test.tsx Dosyayı Görüntüle

@@ -99,6 +99,29 @@ describe('LinkButton', () => {
expect(button).toHaveClass('pl-2 gap-2 pr-2'); expect(button).toHaveClass('pl-2 gap-2 pr-2');
}); });


it('renders an icon', () => {
render(
<LinkButton
icon={<div />}
/>,
);

const icon = screen.getByTestId('icon');
expect(icon).toBeInTheDocument();
});

it('renders icon after children', () => {
render(
<LinkButton
iconAfterChildren
icon={<span />}
/>,
);

const childrenParent = screen.getByTestId('childrenParent');
expect(childrenParent).toHaveClass('flex-row-reverse');
});

describe.each` describe.each`
size | className size | className
${'small'} | ${'h-10'} ${'small'} | ${'h-10'}
@@ -179,17 +202,6 @@ describe('LinkButton', () => {
expect(children).toHaveTextContent('Foo'); expect(children).toHaveTextContent('Foo');
}); });


it.each(Button.AVAILABLE_TYPES)('renders a link with type %s', (buttonType) => {
render(
<LinkButton
href="#"
type={buttonType}
/>,
);
const button = screen.getByRole('link');
expect(button).toHaveProperty('type', buttonType);
});

it('renders a disabled link', () => { it('renders a disabled link', () => {
render( render(
<LinkButton <LinkButton


+ 1
- 0
categories/web/navigation/react/src/components/LinkButton/index.tsx Dosyayı Görüntüle

@@ -124,6 +124,7 @@ export const LinkButton = React.forwardRef<LinkButtonDerivedElement, LinkButtonP
style={style} style={style}
> >
<span <span
data-testid="childrenParent"
className={clsx( className={clsx(
'flex-auto min-w-0 flex items-center gap-2', 'flex-auto min-w-0 flex items-center gap-2',
iconAfterChildren ? 'flex-row-reverse' : 'flex-row', iconAfterChildren ? 'flex-row-reverse' : 'flex-row',


Yükleniyor…
İptal
Kaydet