Chaim Lev-Ari
72 lines
2.4 KiB
TypeScript
72 lines
2.4 KiB
TypeScript
import userEvent from '@testing-library/user-event';
|
|
import { HttpResponse, http } from 'msw';
|
|
import { render, screen } from '@testing-library/react';
|
|
|
|
import { UserViewModel } from '@/portainer/models/user';
|
|
import { withUserProvider } from '@/react/test-utils/withUserProvider';
|
|
import { withTestRouter } from '@/react/test-utils/withRouter';
|
|
import { withTestQueryProvider } from '@/react/test-utils/withTestQuery';
|
|
import { server } from '@/setup-tests/server';
|
|
import { createMockEnvironment } from '@/react-tools/test-mocks';
|
|
|
|
import { CreateContainerInstanceForm } from './CreateContainerInstanceForm';
|
|
|
|
vi.mock('@uirouter/react', async (importOriginal: () => Promise<object>) => ({
|
|
...(await importOriginal()),
|
|
useCurrentStateAndParams: vi.fn(() => ({
|
|
params: { endpointId: 5 },
|
|
})),
|
|
}));
|
|
|
|
function renderComponent() {
|
|
const user = new UserViewModel({ Username: 'user' });
|
|
const Wrapped = withTestQueryProvider(
|
|
withUserProvider(withTestRouter(CreateContainerInstanceForm), user)
|
|
);
|
|
|
|
return render(<Wrapped />);
|
|
}
|
|
|
|
describe('CreateContainerInstanceForm', () => {
|
|
beforeEach(() => {
|
|
server.use(
|
|
http.get('/api/endpoints/5', () =>
|
|
HttpResponse.json(createMockEnvironment())
|
|
)
|
|
);
|
|
});
|
|
|
|
// TODO: from R8S-730 - enable this test once it passes
|
|
it.skip('should not display any visible error messages on initial load', async () => {
|
|
renderComponent();
|
|
|
|
const errors = await screen.findByRole('alert');
|
|
|
|
// Check that no error messages (role="alert") are visible
|
|
expect(errors).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('submit button should be disabled when name or image is missing', async () => {
|
|
const { findByText, getByText, getByLabelText } = renderComponent();
|
|
|
|
await expect(findByText(/Azure settings/)).resolves.toBeVisible();
|
|
|
|
const button = getByText(/Deploy the container/);
|
|
expect(button).toBeVisible();
|
|
expect(button).toBeDisabled();
|
|
|
|
const nameInput = getByLabelText(/name/i, { selector: 'input' });
|
|
await userEvent.type(nameInput, 'name');
|
|
|
|
const imageInput = getByLabelText(/image/i, { selector: 'input' });
|
|
await userEvent.type(imageInput, 'image');
|
|
|
|
await expect(findByText(/Deploy the container/)).resolves.toBeEnabled();
|
|
|
|
expect(nameInput).toHaveValue('name');
|
|
await userEvent.clear(nameInput);
|
|
|
|
await expect(findByText(/Deploy the container/)).resolves.toBeDisabled();
|
|
});
|
|
});
|