Add tests for button

Author: djhi

packages/ra-ui-materialui/src/button/Button.spec.tsx

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { render, screen } from '@testing-library/react';
+import expect from 'expect';
+import polyglotI18nProvider from 'ra-i18n-polyglot';
+import englishMessages from 'ra-language-english';
+import {
+    ReactNodeLabel,
+    SimpleStringLabel,
+    TranslationKeyLabel,
+} from './Button.stories';
+
+describe('<DeleteButton />', () => {
+    it('should allow simple string as label', async () => {
+        const i18nProvider = polyglotI18nProvider(() => englishMessages, 'en');
+        const translate = jest.spyOn(i18nProvider, 'translate');
+        render(<SimpleStringLabel i18nProvider={i18nProvider} />);
+        await screen.findByText('A non translated string');
+        expect(translate).toHaveBeenCalledWith('A non translated string', {
+            _: 'A non translated string',
+        });
+    });
+    it('should allow translation keys as label', async () => {
+        const i18nProvider = polyglotI18nProvider(() => englishMessages, 'en');
+        const translate = jest.spyOn(i18nProvider, 'translate');
+        render(<TranslationKeyLabel i18nProvider={i18nProvider} />);
+        await screen.findByText('Create');
+        expect(translate).toHaveBeenCalledWith('ra.action.create', {
+            _: 'ra.action.create',
+        });
+    });
+    it('should ReactNode as label', async () => {
+        const i18nProvider = polyglotI18nProvider(() => englishMessages, 'en');
+        const translate = jest.spyOn(i18nProvider, 'translate');
+        render(<ReactNodeLabel i18nProvider={i18nProvider} />);
+        await screen.findByText('A ReactNode');
+        expect(translate).not.toHaveBeenCalled();
+    });
+});

packages/ra-ui-materialui/src/button/Button.stories.tsx

@@ -3,7 +3,9 @@ import { ReactNode } from 'react';
 import { createTheme, ThemeProvider, Stack } from '@mui/material';
 import type { PaletteColor } from '@mui/material';
 import AddIcon from '@mui/icons-material/Add';
-
+import polyglotI18nProvider from 'ra-i18n-polyglot';
+import englishMessages from 'ra-language-english';
+import { I18nContextProvider, I18nProvider } from 'ra-core';
 import { Button } from './Button';
 import { defaultTheme } from '../theme/defaultTheme';
 
@@ -25,6 +27,47 @@ export const Basic = () => (
     </ThemeProvider>
 );
 
+const defaultI18nProvider = polyglotI18nProvider(() => englishMessages, 'en');
+export const SimpleStringLabel = ({
+    i18nProvider = defaultI18nProvider,
+}: {
+    i18nProvider?: I18nProvider;
+}) => (
+    <I18nContextProvider value={i18nProvider}>
+        <ThemeProvider theme={createTheme(defaultTheme)}>
+            <UIWrapper>
+                <Button label="A non translated string" />
+            </UIWrapper>
+        </ThemeProvider>
+    </I18nContextProvider>
+);
+export const TranslationKeyLabel = ({
+    i18nProvider = defaultI18nProvider,
+}: {
+    i18nProvider?: I18nProvider;
+}) => (
+    <I18nContextProvider value={i18nProvider}>
+        <ThemeProvider theme={createTheme(defaultTheme)}>
+            <UIWrapper>
+                <Button label="ra.action.create" variant="outlined" />
+            </UIWrapper>
+        </ThemeProvider>
+    </I18nContextProvider>
+);
+export const ReactNodeLabel = ({
+    i18nProvider = defaultI18nProvider,
+}: {
+    i18nProvider?: I18nProvider;
+}) => (
+    <I18nContextProvider value={i18nProvider}>
+        <ThemeProvider theme={createTheme(defaultTheme)}>
+            <UIWrapper>
+                <Button label={<>A ReactNode</>} variant="contained" />
+            </UIWrapper>
+        </ThemeProvider>
+    </I18nContextProvider>
+);
+
 export const WithIcon = () => (
     <ThemeProvider theme={createTheme(defaultTheme)}>
         <UIWrapper>
@@ -49,7 +92,7 @@ export const WithThemeProps = () => (
                 // @ts-ignore
                 RaButton: {
                     defaultProps: {
-                        size: 'normal',
+                        size: 'large',
                         color: 'secondary',
                     },
                 },