Update dependency checking to factor in hidden/invalid element

src/@episerver/forms-react/src/hooks/useElement.ts

@@ -94,7 +94,7 @@ export const useElement = (element: FormElementBase) => {
         }
 
         //check form field dependencies
-        const checkConditions = formCondition.checkConditions(formContext?.formSubmissions as FormSubmission[]);
+        const checkConditions = formCondition.checkConditions(formContext?.formSubmissions as FormSubmission[], formContext?.elementDependencies);
         if (checkConditions) {
             //if isDependenciesSatisfied = true, and if SatisfiedAction = show, then show element. otherwise hide element.
             isVisible.current = equals(conditionProps.satisfiedAction, SatisfiedActionType.Show);

src/@episerver/forms-sdk/src/form-depend-conditions/formDependConditions.ts

@@ -1,5 +1,6 @@
 import { equals, isNull } from "../helpers";
-import { ConditionCombinationType, ConditionProperties, FormElementBase, FormSubmission } from "../models";
+import { getValueOfDependeeElement } from "../helpers/dependencyHelper";
+import { Condition, ConditionCombinationType, ConditionProperties, ElementDependencies, FormElementBase, FormSubmission } from "../models";
 import { ConditionFunctions } from "./ConditionFunctions";
 /**
  * Class to check if a element conditions is met
@@ -14,7 +15,7 @@ export class FormDependConditions {
      * @param formSubmissions 
      * @returns 
      */
-    checkConditions = (formSubmissions: FormSubmission[]): boolean => {
+    checkConditions = (formSubmissions: FormSubmission[], elementDependencies: ElementDependencies[] = []): boolean => {
         if (!isNull(formSubmissions)) {
             const conditionProps = (this._element.properties as unknown) as ConditionProperties;
             if (isNull(conditionProps?.conditions)) {
@@ -23,10 +24,10 @@ export class FormDependConditions {
             }
             for (let i = 0; i < conditionProps.conditions.length; i++) {
                 const condition = conditionProps.conditions[i]
-                const fieldValue = formSubmissions.filter(s => equals(s.elementKey, condition.field))[0]?.value;
+                const dependeeFieldValue = getValueOfDependeeElement(condition,formSubmissions,elementDependencies);
                 const conditionFunction = ConditionFunctions[condition.operator];
                 if (!isNull(conditionFunction)){
-                    let checkResult = conditionFunction(fieldValue == null? "":fieldValue.toString(), condition.fieldValue)
+                    let checkResult = conditionFunction(dependeeFieldValue == null? "" : dependeeFieldValue.toString(), condition.fieldValue)
                     if (conditionProps.conditionCombination === ConditionCombinationType.Any && checkResult) {
                         return true
                     }

src/@episerver/forms-sdk/src/form-loader/formLoader.ts

@@ -87,7 +87,6 @@ export class FormLoader<T extends FormContainer> {
                     if (response.ok) {
                         let json = await response.json();
                         let formStr = json.data.FormContainer.items[0];
-                        console.log(formStr)
                         let convertedFormStr = this.convertFirstLetterToLowerCase(formStr) as T
                         resolve(convertedFormStr)
                     }

src/@episerver/forms-sdk/src/helpers/dependencyHelper.ts

@@ -1,3 +1,16 @@
+import { Condition, ElementDependencies, FormSubmission } from "../models";
+import { equals } from "./utils";
+
 export function getConcatString(srcObject: any, seperator: string): string {
     return (srcObject instanceof Array) ? srcObject.join(seperator) : srcObject as string;
+}
+
+export function getValueOfDependeeElement(condition: Condition ,formSubmissions: FormSubmission[], elementDependencies: ElementDependencies[]) : any  {
+    var dependeeFieldValue = formSubmissions.filter(s => equals(s.elementKey, condition.field))[0]?.value;
+    const dependeeElement = elementDependencies.find(e => e.elementKey === condition.field)
+    if (dependeeElement && !dependeeElement.isSatisfied ) {
+        // if element is in the inactive list, consider its value as undefined
+        dependeeFieldValue = undefined;
+    }
+    return dependeeFieldValue;
 }