From e51676eea0ad4ca616d865ab39c8639f217362d7 Mon Sep 17 00:00:00 2001 From: Chhavi Goyal Date: Tue, 9 Dec 2025 08:23:14 -0500 Subject: [PATCH] fix(common): environment variables not detected in request body editors (#5616) Co-authored-by: nivedin --- .../src/components/collections/index.vue | 6 ++ .../src/helpers/collection/collection.ts | 6 ++ .../editor/extensions/HoppEnvironment.ts | 74 +++++++++++++------ 3 files changed, 62 insertions(+), 24 deletions(-) diff --git a/packages/hoppscotch-common/src/components/collections/index.vue b/packages/hoppscotch-common/src/components/collections/index.vue index fcef25d3..593e8d77 100644 --- a/packages/hoppscotch-common/src/components/collections/index.vue +++ b/packages/hoppscotch-common/src/components/collections/index.vue @@ -1880,6 +1880,9 @@ const onRemoveRequest = async () => { // since the request is deleted, we need to remove the saved responses as well possibleTab.value.document.request.responses = {} + + // remove inherited properties + possibleTab.value.document.inheritedProperties = undefined } const requestToRemove = navigateToFolderWithIndexPath( @@ -1941,6 +1944,9 @@ const onRemoveRequest = async () => { // since the request is deleted, we need to remove the saved responses as well possibleTab.value.document.request.responses = {} + + // remove inherited properties + possibleTab.value.document.inheritedProperties = undefined } } } diff --git a/packages/hoppscotch-common/src/helpers/collection/collection.ts b/packages/hoppscotch-common/src/helpers/collection/collection.ts index c3b0f3fc..58aa4abf 100644 --- a/packages/hoppscotch-common/src/helpers/collection/collection.ts +++ b/packages/hoppscotch-common/src/helpers/collection/collection.ts @@ -231,6 +231,9 @@ function resetSaveContextForAffectedRequests(folderPath: string) { if (tab.value.document.type === "request") { // since the request is deleted, we need to remove the saved responses as well tab.value.document.request.responses = {} + + // remove inherited properties + tab.value.document.inheritedProperties = undefined } } } @@ -261,6 +264,9 @@ export async function resetTeamRequestsContext() { if (tab.value.document.type === "request") { // since the request is deleted, we need to remove the saved responses as well tab.value.document.request.responses = {} + + // remove inherited properties + tab.value.document.inheritedProperties = undefined } } } diff --git a/packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts b/packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts index 2538a755..61d20a5a 100644 --- a/packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts +++ b/packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts @@ -8,8 +8,8 @@ import { } from "@codemirror/view" import { StreamSubscriberFunc } from "@composables/stream" import { - HoppRESTRequestVariables, parseTemplateStringE, + HoppRESTRequestVariables, } from "@hoppscotch/data" import * as E from "fp-ts/Either" import { Ref, watch } from "vue" @@ -124,9 +124,12 @@ const cursorTooltipField = (aggregateEnvs: AggregateEnvironment[]) => const envName = tooltipEnv?.sourceEnv ?? "Choose an Environment" let envInitialValue = tooltipEnv?.initialValue - // If the environment is not a request variable, get the current value from the current environment service + + // If the environment is not a request variable or collection variable, get the current value from the current environment service + // For collection variables and request variables, use the value directly from tooltipEnv let envCurrentValue = - tooltipEnv?.sourceEnv !== "RequestVariable" + tooltipEnv?.sourceEnv !== "RequestVariable" && + tooltipEnv?.sourceEnv !== "CollectionVariable" ? currentEnvironmentValueService.getEnvironmentByKey( tooltipEnv?.sourceEnv !== "Global" ? currentSelectedEnvironment.id @@ -398,25 +401,36 @@ export class HoppEnvironmentPlugin { subscribeToStream: StreamSubscriberFunc, private editorView: Ref ) { - const aggregateEnvs = getAggregateEnvsWithCurrentValue() - const currentTab = restTabs.currentActiveTab.value - const currentTabRequest = - currentTab.document.type === "example-response" - ? currentTab.document.response.originalRequest - : currentTab.document.request - const currentTabInheritedProperty = currentTab.document.inheritedProperties - - if (!currentTabRequest || !currentTabInheritedProperty) return - + // Watch the current active tab to update the variables accordingly watch( - [currentTabRequest, currentTabInheritedProperty], - ([request, document]) => { + () => restTabs.currentActiveTab.value, + (currentTab) => { + const request = + currentTab.document.type === "example-response" + ? currentTab.document.response.originalRequest + : currentTab.document.request + + const inheritedProperties = currentTab.document.inheritedProperties + + // Extract collection variables safely, handling undefined or non-inherited-property types + const collectionVariables = + inheritedProperties && "variables" in inheritedProperties + ? inheritedProperties.variables + : [] + + // Get request variables if available, otherwise use empty array + const requestVariables = + request && "requestVariables" in request + ? request.requestVariables + : [] + const requestAndCollVars = getRequestAndCollectionVariables( - request.requestVariables, - document.variables + requestVariables, + collectionVariables ) - this.envs = [...requestAndCollVars, ...aggregateEnvs] + const currentAggregateEnvs = getAggregateEnvsWithCurrentValue() + this.envs = [...requestAndCollVars, ...currentAggregateEnvs] this.editorView.value?.dispatch({ effects: this.compartment.reconfigure([ @@ -428,13 +442,25 @@ export class HoppEnvironmentPlugin { { immediate: true, deep: true } ) - const requestAndCollVars = getRequestAndCollectionVariables( - currentTabRequest.requestVariables, - currentTabInheritedProperty.variables - ) - subscribeToStream(aggregateEnvsWithCurrentValue$, (envs) => { - this.envs = [...requestAndCollVars, ...envs] + // Recompute request and collection variables from current tab to avoid stale closure values + const tab = restTabs.currentActiveTab.value + const request = + tab.document.type === "example-response" + ? tab.document.response.originalRequest + : tab.document.request + const inheritedProperties = tab.document.inheritedProperties + + // Get request variables if available, otherwise use empty array + const requestVariables = + request && "requestVariables" in request ? request.requestVariables : [] + + const freshRequestAndCollVars = getRequestAndCollectionVariables( + requestVariables, + inheritedProperties?.variables ?? [] + ) + + this.envs = [...freshRequestAndCollVars, ...envs] this.editorView.value?.dispatch({ effects: this.compartment.reconfigure([