feat(*): enable config card format (#111)

* feat(*): enable config card format * test(*): fix case * test(*): fix case * test(*): fix case
Kong · Oct 20, 2023 · f8fc065 · f8fc065
1 parent 32e805e
commit f8fc065
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 23 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -106,13 +106,14 @@ const sidebarItems = computed<Array<SidebarPrimaryItem>>(() => [
   font-size: 20px;
 }
 
-:deep(main.kong-ui-app-layout-main) {
-  background: #fff!important;
-}
-
 :deep(.kong-ui-app-layout-content-inner) {
   position: relative;
   min-height: 100%;
   padding-bottom: 80px!important;
 }
+
+// TODO: remove this when we upgrade to Kongponents v9
+:deep(.k-code-block.theme-dark pre) {
+  background-color: $kui-color-background-neutral-strongest!important;
+}
 </style>
diff --git a/src/composables/useDetailGeneralConfig.ts b/src/composables/useDetailGeneralConfig.ts
@@ -11,5 +11,6 @@ export const useDetailGeneralConfig = () => {
       version: config.GATEWAY_VERSION,
     },
     apiBaseUrl: config.ADMIN_API_URL,
-  } as Pick<KongManagerBaseEntityConfig, 'app' | 'workspace' | 'gatewayInfo' | 'apiBaseUrl'>)
+    jsonYamlEnabled: true,
+  } as Pick<KongManagerBaseEntityConfig, 'app' | 'workspace' | 'gatewayInfo' | 'apiBaseUrl' | 'jsonYamlEnabled'>)
 }
diff --git a/src/pages/vaults/Form.vue b/src/pages/vaults/Form.vue
@@ -45,7 +45,10 @@ const routeOnUpdate = useFormRedirectOnUpdate(
 
 const vaultFormConfig = reactive({
   ...useFormGeneralConfig(),
-  azureVaultProviderAvailable: false,
+  // azure vault is supported in Kong Gateway Enterprise 3.5
+  azureVaultProviderAvailable: useGatewayFeatureSupported({
+    enterprise: ['3.5'],
+  }),
   // ttl fields are supported in Kong Gateway Enterprise 3.4
   ttl: useGatewayFeatureSupported({
     enterprise: ['3.4'],

diff --git a/src/styles/typography.scss b/src/styles/typography.scss
@@ -42,14 +42,6 @@ ul {
   transition: all 250ms ease;
 }
 
-code {
-  padding: .1rem .2rem;
-  font-size: 90%;
-  color: #bd4147;
-  background-color: #f7f7f9;
-  border-radius: .25rem;
-}
-
 .plugin-icon {
   width: 22px;
   margin-right: 12px;

diff --git a/tests/playwright/commands/clickConfigurationCopy.ts b/tests/playwright/commands/clickConfigurationCopy.ts
@@ -1,6 +1,9 @@
+import type { Page, Locator } from '@playwright/test'
+import { selectOption } from './selectOption'
+
 export const clickConfigurationCopy = async (pageOrLocator: Page | Locator, entity: string) => {
-  await pageOrLocator.locator(`.kong-ui-${entity}-entity-config-card`)
-    .locator('.config-card-actions')
-    .locator('[data-testid="json-copy-button"]')
-    .click()
-}
+  const configCardLocator = pageOrLocator.locator(`.kong-ui-${entity}-entity-config-card`)
+
+  await selectOption(configCardLocator.locator('.config-card-actions'), 'json')
+  await configCardLocator.getByTestId('k-code-block-copy-button').click()
+}
diff --git a/tests/playwright/specs/consumers/01-Consumers.spec.ts b/tests/playwright/specs/consumers/01-Consumers.spec.ts
@@ -145,12 +145,8 @@ test.describe('consumers', () => {
   })
 
   test('consumer detail page - copy json to clipboard', async ({ browserName, page }) => {
-    const consumerListPage = new ConsumerListPage(page)
-
     await withNavigation(page, () => clickEntityListAction(page, 'view'))
     await clickConfigurationCopy(page, 'consumer')
-    await expect(page.locator(consumerListPage.$.success)).toBeVisible()
-    await expect(page.locator(consumerListPage.$.success)).toContainText('Successfully copied to clipboard')
 
     // TODO Skip on Webkit
     if (browserName !== 'webkit') {