feat(routes): support expressions routes (#217)

.ci/docker-compose.yml

@@ -50,6 +50,7 @@ services:
       KONG_PG_USER: kong
       KONG_ADMIN_LISTEN: "0.0.0.0:8001"
       KONG_ANONYMOUS_REPORTS: "off"
+      KONG_ROUTER_FLAVOR:
     restart: always
     depends_on:
       &kong-depends_on

.github/actions/select-gateway-image/action.yml

@@ -20,7 +20,7 @@ runs:
       shell: bash
       env:
         DEFAULT_GATEWAY_IMAGE: |-
-          ${{ format('{0}', inputs.enterprise) == 'true' && 'kong/kong-gateway-internal:nightly-ubuntu' || 'kong/kong:nightly-ubuntu' }}
+          ${{ format('{0}', inputs.enterprise) == 'true' && 'kong/kong-gateway-internal:nightly-ubuntu' || 'kong/kong:master-ubuntu' }}
       run: |
         GATEWAY_IMAGE="${{ inputs.current-image }}"
 

.github/workflows/.reusable_e2e_tests_oss.yml

@@ -34,6 +34,10 @@ jobs:
           - services
           - snis
           - upstreams
+        router-flavor: [traditional_compatible]
+        include:
+          - suite: routes-expressions
+            router-flavor: expressions
       fail-fast: false
     name: ${{ matrix.suite }}
     runs-on: ${{ vars.RUNS_ON }}
@@ -84,6 +88,7 @@ jobs:
         working-directory: ${{ github.workspace }}
         env:
           GATEWAY_IMAGE: ${{ inputs.gateway-image }}
+          KONG_ROUTER_FLAVOR: ${{ matrix.router-flavor }}
         run: |
           _compose_exit=0
           docker compose -f .ci/docker-compose.yml up -d kong --wait || _compose_exit=$?

package.json

@@ -31,8 +31,8 @@
     "@kong-ui-public/entities-key-sets": "^3.0.11",
     "@kong-ui-public/entities-keys": "^3.0.11",
     "@kong-ui-public/entities-plugins": "^4.1.0",
-    "@kong-ui-public/entities-routes": "^3.0.0",
-    "@kong-ui-public/entities-shared": "^3.0.0",
+    "@kong-ui-public/entities-routes": "^3.1.5",
+    "@kong-ui-public/entities-shared": "^3.1.1",
     "@kong-ui-public/entities-snis": "^3.0.11",
     "@kong-ui-public/entities-upstreams-targets": "^3.0.11",
     "@kong-ui-public/entities-vaults": "^3.0.11",
@@ -84,6 +84,7 @@
     "typescript": "^5.3.2",
     "vite": "^4.3.9",
     "vite-plugin-html": "^3.2.0",
+    "vite-plugin-monaco-editor": "^1.1.0",
     "vue-eslint-parser": "^9.3.2",
     "vue-tsc": "^1.8.22"
   }

src/pages/routes/Form.vue

@@ -4,18 +4,21 @@
     :config="routeFormConfig"
     :route-id="id"
     :service-id="serviceId"
+    :route-flavors="routeFlavors"
     @update="handleUpdate"
   />
 </template>
 
 <script setup lang="ts">
 import { computed, reactive } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import { RouteForm } from '@kong-ui-public/entities-routes'
+import { RouteForm, type RouteFlavors } from '@kong-ui-public/entities-routes'
 import { useFormGeneralConfig } from '@/composables/useFormGeneralConfig'
 import { useFormRedirectOnCancel, useFormRedirectOnUpdate } from '@/composables/useFormRedirect'
 import { useToaster } from '@/composables/useToaster'
 import { useI18n } from '@/composables/useI18n'
+import { useInfoStore } from '@/stores/info'
+import { storeToRefs } from 'pinia'
 
 defineOptions({
   name: 'RouteForm',
@@ -26,6 +29,12 @@ const router = useRouter()
 const toaster = useToaster()
 const { t } = useI18n()
 
+const infoStore = useInfoStore()
+const { infoConfig } = storeToRefs(infoStore)
+const routeFlavors = computed<RouteFlavors>(() => ({
+  traditional: true, expressions: infoConfig.value.router_flavor === 'expressions',
+}))
+
 const id = computed(() => (route.params.id as string) ?? '')
 const serviceId = computed(() => (route.query.serviceId as string) ?? '')
 

src/pages/routes/List.vue

@@ -19,6 +19,7 @@
     :can-delete="canDelete"
     :can-edit="canEdit"
     :can-retrieve="canRetrieve"
+    :has-expression-column="supportExpressions"
     @copy:success="onCopySuccess"
     @copy:error="onCopyError"
     @delete:success="onDeleteSuccess"
@@ -37,6 +38,8 @@ import { useToaster } from '@/composables/useToaster'
 import { useI18n } from '@/composables/useI18n'
 import { useDocsLink } from '@/composables/useDocsLink'
 import { EntityType } from '@/types'
+import { useInfoStore } from '@/stores/info'
+import { storeToRefs } from 'pinia'
 
 defineOptions({ name: 'RouteList' })
 
@@ -46,6 +49,10 @@ const { t } = useI18n()
 const docsLink = useDocsLink(EntityType.Route)
 const { createRedirectRouteQuery } = useListRedirect()
 
+const infoStore = useInfoStore()
+const { infoConfig } = storeToRefs(infoStore)
+const supportExpressions = computed(() => infoConfig.value.router_flavor === 'expressions')
+
 const serviceId = computed(() => (route.params?.id ?? '') as string)
 const cacheIdentifier = computed(() => `routes-${serviceId.value}`)
 

tests/playwright/commands/fetchKongResource.ts

@@ -0,0 +1,21 @@
+import { handleRequestError } from '@pw/helpers/misc'
+import type { AxiosError, AxiosRequestConfig, Method } from 'axios'
+import axios from 'axios'
+
+export const fetchKongResource = async (endpoint: string) => {
+  const kongUrl = process.env.KM_TEST_API_URL
+  const options: AxiosRequestConfig = {
+    method: 'GET' as Method,
+    url: `${kongUrl}${endpoint}`,
+    headers: {
+      'Content-Type': 'application/json',
+      'Connection': 'close',
+    },
+  }
+
+  try {
+    return await axios(options)
+  } catch (err) {
+    handleRequestError('fetchKongResource', err as AxiosError<object>)
+  }
+}

tests/playwright/pages/routes.ts

@@ -10,3 +10,15 @@ export class RouteListPage extends POM {
     super(page, '/routes')
   }
 }
+
+export class RouteCreatePage extends POM {
+  public $ = {
+    ...POM.$,
+  }
+
+  constructor (page: Page, options: { serviceId?: string } = {}) {
+    const { serviceId = '' } = options
+
+    super(page, `/routes/create?serviceId=${serviceId}`)
+  }
+}