standalone: fix regressions for e2e test and standard deploy flow

cypress.config.mjs

@@ -7,7 +7,7 @@ export default defineConfig({
   defaultCommandTimeout,
   videoCompression: false,
   video: false,
-  numTestsKeptInMemory: 0,
+  numTestsKeptInMemory: 1,
   watchForFileChanges: false,
   // enable for Cypress 12.x
   // experimentalMemoryManagement: true,

cypress/support/run-recreate-deployment.js

@@ -331,7 +331,6 @@ Cypress.Commands.add('recreateDeployment', options => {
     cy.wait(BASE_TIMEOUT / 50)
 
     if(shouldDeploy) {
-
       cy.whenUnfurlGUI(() => {
         cy.get('[data-testid="deploy-button"]:not([disabled])').click({force: true})
         cy.url({timeout: BASE_TIMEOUT * 10}).should('not.include', 'deployment-drafts')
@@ -368,6 +367,7 @@ Cypress.Commands.add('recreateDeployment', options => {
         // cy.get('[data-testid="deploy-button"]:not([disabled])').click({position: 'bottomLeft'})
         // doesn't work reliably in CI
         // popover tooltip may partially cover when deplying DRYRUN
+        cy.get('[data-testid="deploy-button"]:not([disabled])').click({force: true})
         cy.url({timeout: BASE_TIMEOUT * 10}).should('include', dt.name)
         cy.wait(BASE_TIMEOUT)
         cy.withJob((job) => {

jsconfig.json

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "target": "es6",        // Specify ECMAScript target version: 'es5', 'es6', 'es2016', 'es2017', 'es2018', 'esnext', etc.
+    "module": "commonjs",   // Specify module code generation: 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', 'none'
+    "checkJs": false,        // Enable/disable type checking in JavaScript files
+    "jsx": "preserve",      // Specify JSX code generation: 'preserve', 'react-native', or 'react'
+    "baseUrl": ".",         // Base directory to resolve non-relative module names
+    "paths": {
+      "oc/*": ["src/assets/javascripts/*"],
+      "oc_dashboard": ["src/gitlab-oc/dashboard"],
+      "oc_dashboard/*": ["src/gitlab-oc/dashboard/*"],
+      "oc_vue_shared/*": ["src/gitlab-oc/vue_shared/*"],
+      "~/*": ["src/assets/javascripts/*"],
+      "oc_pages/*": ["src/gitlab-oc/*"]
+    }
+  },
+  "include": [
+    "src/**/*"              // Include all files in the 'src' folder and subfolders
+  ],
+  "exclude": [
+    "node_modules",         // Exclude 'node_modules' folder
+    "dist"                  // Exclude 'dist' folder
+  ]
+}

packages/oc-pages/.eslintrc.js

@@ -20,7 +20,7 @@ module.exports = {
     ecmaVersion: 2020
   },
   rules: {
-    semi: [1],
+    semi: 'off', // XXX [1]
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
     /*

packages/oc-pages/dashboard/components/dashboard-deploy-dialog.vue

@@ -1,7 +1,7 @@
 <script>
 
 import { __ } from '~/locale'
-import { mapGetters, mapActions } from 'vuex'
+import { mapGetters, mapActions, mapMutations } from 'vuex'
 import { GlModal, GlDropdown, GlDropdownItem, GlLoadingIcon} from '@gitlab/ui';
 import { queryParamVar } from 'oc_vue_shared/util'
 import { unfurlServerExport} from 'oc_vue_shared/client_utils/unfurl-server'
@@ -29,14 +29,30 @@ export default {
         ...mapActions([
             'environmentFetchTypesWithParams',
         ]),
+        ...mapMutations([
+            'createError',
+        ]),
         async doSetup() {
             await this.environmentFetchTypesWithParams({ environmentName: this.environmentName })
             const types = this.environmentResourceTypeDict(this.environmentName)
             this.blueprints = Object.values(types).filter(t => t.directives?.includes('substitute'))
+            if(this.blueprints.length == 0) {
+                this.createError({
+                    message: 'No valid blueprints found',
+                    context: {
+                        environmentName: this.environmentName,
+                        visibleTypes: Object.values(types).map(type => type.name)
+                    }
+                })
+            }
         },
         primarySelectTemplate() {
             if(this.$refs.baseDeployDialog) {
-                this.$refs.baseDeployDialog.redirectToTemplateEditor()
+                if(this.$refs.baseDeployDialog.creatingEnvironment) {
+                    this.$refs.baseDeployDialog.redirectToNewEnvironment()
+                } else {
+                    this.$refs.baseDeployDialog.redirectToTemplateEditor()
+                }
             }
         },
         primarySelectAppBlueprint() {
@@ -54,6 +70,9 @@ export default {
             this.blueprintProject = undefined
             this.ts = undefined
             this.fn = undefined
+            this.bprev = undefined
+            this.env = undefined
+            this.provider = undefined
             this.baseDialogComplete = false
         },
         backSelectAppBlueprint() {
@@ -90,12 +109,15 @@ export default {
         },
         enabled: {
             get() {
-                return this.$route.hash == NEW_DEPLOYMENT_HASH
+                return (
+                    this.$route.hash == NEW_DEPLOYMENT_HASH ||
+                    !!this.blueprintProject
+                )
             },
             set(val) {
                 // avoids duplicated navigation error
                 if(val) {
-                window.location.hash = val
+                    window.location.hash = NEW_DEPLOYMENT_HASH
                 } else {
                     this.reset()
                 }
@@ -104,6 +126,9 @@ export default {
         ...queryParamVar('blueprintProject'),
         ...queryParamVar('ts'),
         ...queryParamVar('fn'),
+        ...queryParamVar('bprev'),
+        ...queryParamVar('env'),
+        ...queryParamVar('provider'),
         stage() {
             if(this.blueprintProject) return 'SelectTemplate'
             return 'SelectAppBlueprint'

packages/oc-pages/dashboard/pages/home.vue

@@ -1,6 +1,6 @@
 <script>
 import TableComponent from 'oc_vue_shared/components/oc/table.vue';
-import MarkdownView from 'oc_vue_shared/components/oc/markdown-view'
+import MarkdownView from 'oc_vue_shared/components/oc/markdown-view.vue'
 
 import QuantityCard from '../components/quantity-card.vue'
 import ApplicationCell from '../components/cells/application-cell.vue'
@@ -54,8 +54,8 @@ export default {
             routes,
             //fields,
             //items: [],
-            readme: gon.readme,
-            readmeRaw: gon.readmeRaw,
+            readme: window.gon.readme,
+            readmeRaw: window.gon.readmeRaw,
             loaded: false,
             standalone,
         };

packages/oc-pages/project_overview/store/modules/environments.js

@@ -708,7 +708,7 @@ const actions = {
 
 };
 function envFilter(name){
-    return env => env.name == name
+    return env => env?.name == name
 }
 
 const getters = {

packages/oc-pages/vue_shared/components/oc/base-deploy-dialog.vue

@@ -43,15 +43,16 @@ export default {
             createEnvironmentName: '',
             createEnvironmentProvider: '',
             currentTag: null,
-            version: null,
             mainBranchCommitId: null,
+            userSpecifiedDeploymentName: !!this.$route.query.fn, // hopefully we'll consider it to be user modified if they were redirected
             standalone
         }
     },
     computed: {
         ...queryParamVar('ts'),
         ...queryParamVar('fn'),
         ...queryParamVar('bprev'),
+        ...queryParamVar('env'),
 
         deployDialogError() {
             if (this.instantiateAs == 'deployment-draft') {
@@ -64,17 +65,15 @@ export default {
         },
         ...mapGetters([
             'getNextDefaultDeploymentName',
+            'environmentsAreReady',
+            'lookupEnvironment',
             'getMatchingEnvironments',
             'getDefaultEnvironmentName',
             'lookupDeploymentOrDraft',
             'lookupEnvironment',
             'getHomeProjectPath',
             'getLastUsedEnvironment',
         ]),
-        useUnreleased() {
-            if (!this.currentTag) return false
-            return this.version != this.currentTag.name
-        },
 
         mainAtLastest() {
             if (!this.mainBranchCommitId || !this.currentTag?.commit?.id) return false
@@ -103,14 +102,21 @@ export default {
             if(this.instantiateAs != 'template' && !this.selectedEnvironment) return true
 
             return false
+        },
+
+        environmentSelectionFromUrl() {
+            if(!this.environmentsAreReady) return null
+            if(!this.env) return null
+
+            return this.lookupEnvironment(this.env)
         }
     },
     watch: {
         templateSelected: {
             immediate: true,
             handler (val) {
                 this.ts = val.name
-                if (this.fn) return
+                if (this.userSpecifiedDeploymentName) return
                 if (val && this.instantiateAs == 'deployment-draft') {
                     this.fn = this.getNextDefaultDeploymentName(
                         this.applicationBlueprint?.title + ' ' + lookupCloudProviderShortName(val.cloud)
@@ -123,8 +129,8 @@ export default {
 
         currentTag(currentTag) {
             if (!currentTag) return
-            if (!this.version) {
-                this.version = currentTag.name
+            if (!this.bprev) {
+                this.bprev = currentTag.name
             }
         },
 
@@ -133,6 +139,19 @@ export default {
             handler(val) {
                 this.$emit('completionStatusSet', !val)
             }
+        },
+        // modal wants to set to false
+        bprev() {
+            if(this.bprev === false) this.bprev = undefined
+        },
+
+        environmentSelectionFromUrl: {
+            immediate: true,
+            handler() {
+                if(!this.selectedEnvironment && this.environmentSelectionFromUrl) {
+                    this.selectedEnvironment = this.environmentSelectionFromUrl
+                }
+            }
         }
     },
     methods: {
@@ -172,6 +191,11 @@ export default {
         }
 
         fetchBranches(encodeURIComponent(this._projectPath)).then(branches => this.mainBranchCommitId = branches.find(b => b.name == 'main')?.commit?.id)
+
+        if(sessionStorage['instantiate_env']) {
+            this.env = sessionStorage['instantiate_env']
+            delete sessionStorage['instantiate_env']
+        }
     }
 }
 </script>
@@ -182,7 +206,7 @@ export default {
         :cloud-provider="templateSelected && templateSelected.cloud" />
     <div v-else-if="applicationBlueprint">
         <gl-form-group label="Name" class="col-md-4 align_left">
-            <gl-form-input id="input1" data-testid="deployment-name-input" v-model="fn"
+            <gl-form-input id="input1" data-testid="deployment-name-input" @change="userSpecifiedDeploymentName = true" v-model="fn"
                 name="input['template-name']" type="text" />
 
         </gl-form-group>
@@ -193,9 +217,9 @@ export default {
                 :environment-creation="!standalone" />
 
             <div v-if="shouldProvideVersionSelection" class="mt-5">
-                <gl-form-radio v-model="version" :value="currentTag.name">Use the current release of
-                    {{ getApplicationBlueprint.title }} (<b>{{ currentTag.name }}</b>)</gl-form-radio>
-                <gl-form-radio v-model="version" value="main"> Use the latest (unreleased) version</gl-form-radio>
+                <gl-form-radio v-model="bprev" :value="currentTag.name">Use the current release of
+                    {{ applicationBlueprint.title }} (<b>{{ currentTag.name }}</b>)</gl-form-radio>
+                <gl-form-radio v-model="bprev" value="main"> Use the latest (unreleased) version</gl-form-radio>
             </div>
         </div>
     </div>

packages/oc-pages/vue_shared/components/oc/ufgui-errors.vue

@@ -88,7 +88,9 @@ export default {
     position: sticky;
 }
 
-body.modal-open .ufgui-error-container {
+/* Doesn't work consistently on dashboard page */
+body.modal-open #OcAppDeployments .ufgui-error-container {
     position: fixed;
+    min-width: min(950px, 100%)
 }
 </style>

scripts/src/integration-test.js

@@ -33,10 +33,11 @@ const GENERATED_PASSWORD = !STANDALONE_UNFURL && btoa(Number.MAX_SAFE_INTEGER *
 const FIXTURES_TMP = path.join(unfurlGuiRoot, 'cypress/fixtures/tmp')
 
 process.env.OC_URL = OC_URL
-process.env.DASHBOARD_DEST = (
-  process.env.DASHBOARD_DEST ||
-  STANDALONE_UNFURL? STANDALONE_PROJECT_DIR: undefined
-)
+
+if(STANDALONE_UNFURL && !process.env.DASHBOARD_DEST) {
+  process.env.DASHBOARD_DEST = STANDALONE_PROJECT_DIR
+}
+
 
 const READ_ARGS = {
   username: (args) => args.u || args.username || (STANDALONE_UNFURL && 'jest' || undefined),
@@ -210,6 +211,10 @@ async function main() {
     username = undefined
   }
 
+  if(username && !process.env.DASHBOARD_DEST) {
+    process.env.DASHBOARD_DEST = `${username}/dashboard`
+  }
+
   if(username) console.log(`${process.env.OC_URL}/${username}/dashboard/-/deployments`)
 
   const GCP_ENVIRONMENT_NAME = ENV_NAMING_FUNCTIONS[ENV_NAMING_FUNCTION]('gcp').toLowerCase()