import { GlTable } from '@gitlab/ui'; import { mountExtended } from 'helpers/vue_test_utils_helper'; import ServiceTable from '~/google_cloud/databases/service_table.vue'; describe('google_cloud/databases/service_table', () => { let wrapper; const findTable = () => wrapper.findComponent(GlTable); beforeEach(() => { const propsData = { cloudsqlPostgresUrl: '#url-cloudsql-postgres', cloudsqlMysqlUrl: '#url-cloudsql-mysql', cloudsqlSqlserverUrl: '#url-cloudsql-sqlserver', alloydbPostgresUrl: '#url-alloydb-postgres', memorystoreRedisUrl: '#url-memorystore-redis', firestoreUrl: '#url-firestore', }; wrapper = mountExtended(ServiceTable, { propsData }); }); afterEach(() => { wrapper.destroy(); }); it('should contain a table', () => { expect(findTable().exists()).toBe(true); }); it.each` name | testId | url ${'cloudsql-postgres'} | ${'button-cloudsql-postgres'} | ${'#url-cloudsql-postgres'} ${'cloudsql-mysql'} | ${'button-cloudsql-mysql'} | ${'#url-cloudsql-mysql'} ${'cloudsql-sqlserver'} | ${'button-cloudsql-sqlserver'} | ${'#url-cloudsql-sqlserver'} ${'alloydb-postgres'} | ${'button-alloydb-postgres'} | ${'#url-alloydb-postgres'} ${'memorystore-redis'} | ${'button-memorystore-redis'} | ${'#url-memorystore-redis'} ${'firestore'} | ${'button-firestore'} | ${'#url-firestore'} `('renders $name button with correct url', ({ testId, url }) => { const button = wrapper.findByTestId(testId); expect(button.exists()).toBe(true); expect(button.attributes('href')).toBe(url); }); });