From ae946c6b263ac41fabf3486caa58c2eeba7f1099 Mon Sep 17 00:00:00 2001 From: Imanpal Singh Date: Sat, 7 Sep 2024 14:17:09 +0530 Subject: [PATCH 1/3] Accept a rename object for outlets Currently outlets are accept via an array of string `[a,b,c]`. This commit adds the ability to also accept a rename object withing this array that will determine how will the outlet be accessed. For example ``` static outlets = ['alpha', {'outlet--with--very--long--name': short}] ``` now instead of `this.outletWithVeryLongNameOutlet` you can use `this.shortOutlet` --- src/core/controller.ts | 4 ++-- src/core/outlet_observer.ts | 10 +++++++++- src/core/outlet_properties.ts | 17 +++++++++++++++-- src/tests/controllers/outlet_controller.ts | 8 ++++++-- 4 files changed, 32 insertions(+), 7 deletions(-) diff --git a/src/core/controller.ts b/src/core/controller.ts index 4b412716..02d2b096 100644 --- a/src/core/controller.ts +++ b/src/core/controller.ts @@ -2,7 +2,7 @@ import { Application } from "./application" import { ClassPropertiesBlessing } from "./class_properties" import { Constructor } from "./constructor" import { Context } from "./context" -import { OutletPropertiesBlessing } from "./outlet_properties" +import { OutletPropertiesBlessing, OutletRenameObject } from "./outlet_properties" import { TargetPropertiesBlessing } from "./target_properties" import { ValuePropertiesBlessing, ValueDefinitionMap } from "./value_properties" @@ -24,7 +24,7 @@ export class Controller { OutletPropertiesBlessing, ] static targets: string[] = [] - static outlets: string[] = [] + static outlets: (string | OutletRenameObject)[] = [] static values: ValueDefinitionMap = {} static get shouldLoad() { diff --git a/src/core/outlet_observer.ts b/src/core/outlet_observer.ts index b0956f47..2d606563 100644 --- a/src/core/outlet_observer.ts +++ b/src/core/outlet_observer.ts @@ -206,7 +206,15 @@ export class OutletObserver implements AttributeObserverDelegate, SelectorObserv const constructor = module.definition.controllerConstructor const outlets = readInheritableStaticArrayValues(constructor, "outlets") - outlets.forEach((outlet) => dependencies.add(outlet, module.identifier)) + outlets.forEach((outlet) => { + let name; + if (typeof outlet === 'object') { + name = Object.keys(outlet)[0] + } else { + name = outlet; + } + return dependencies.add(name, module.identifier) + }); }) return dependencies diff --git a/src/core/outlet_properties.ts b/src/core/outlet_properties.ts index 4af436a4..b48e967c 100644 --- a/src/core/outlet_properties.ts +++ b/src/core/outlet_properties.ts @@ -24,8 +24,18 @@ function getControllerAndEnsureConnectedScope(controller: Controller, element: E if (outletController) return outletController } -function propertiesForOutletDefinition(name: string) { - const camelizedName = namespaceCamelize(name) +function propertiesForOutletDefinition(outletDescription: string | OutletRenameObject) { + let camelizedName: string; + let name: string; + + if (typeof outletDescription === 'object') { + const [[originalName, newName]] = Object.entries(outletDescription) + name = originalName + camelizedName = namespaceCamelize(newName) + } else { + name = outletDescription; + camelizedName = namespaceCamelize(name) + } return { [`${camelizedName}Outlet`]: { @@ -100,3 +110,6 @@ function propertiesForOutletDefinition(name: string) { }, } } + +export type OutletRenameObject = { [key: string]: string }; + diff --git a/src/tests/controllers/outlet_controller.ts b/src/tests/controllers/outlet_controller.ts index b382f80c..c2edac6f 100644 --- a/src/tests/controllers/outlet_controller.ts +++ b/src/tests/controllers/outlet_controller.ts @@ -1,7 +1,8 @@ +import { OutletRenameObject } from "src/core/outlet_properties" import { Controller } from "../../core/controller" class BaseOutletController extends Controller { - static outlets = ["alpha"] + static outlets: (string | OutletRenameObject)[] = ["alpha"] alphaOutlet!: Controller | null alphaOutlets!: Controller[] @@ -12,7 +13,7 @@ class BaseOutletController extends Controller { export class OutletController extends BaseOutletController { static classes = ["connected", "disconnected"] - static outlets = ["beta", "gamma", "delta", "omega", "namespaced--epsilon"] + static outlets = ["beta", "gamma", "delta", "omega", "namespaced--epsilon", { "helpers--common--input": "input" }] static values = { alphaOutletConnectedCallCount: Number, @@ -32,6 +33,9 @@ export class OutletController extends BaseOutletController { betaOutletElements!: Element[] hasBetaOutlet!: boolean + inputOutlet!: Controller | null + inputOutletElement!: Element | null + namespacedEpsilonOutlet!: Controller | null namespacedEpsilonOutlets!: Controller[] namespacedEpsilonOutletElement!: Element | null From 77339d1d66ddf6d79cb6aad9bffce1925d44a3ae Mon Sep 17 00:00:00 2001 From: Imanpal Singh Date: Sat, 7 Sep 2024 14:17:19 +0530 Subject: [PATCH 2/3] add tests --- src/tests/modules/core/outlet_tests.ts | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/tests/modules/core/outlet_tests.ts b/src/tests/modules/core/outlet_tests.ts index fb87ba12..8b659f2a 100644 --- a/src/tests/modules/core/outlet_tests.ts +++ b/src/tests/modules/core/outlet_tests.ts @@ -13,6 +13,8 @@ export default class OutletTests extends ControllerTestCase(OutletController) {
+
+
@@ -37,7 +40,7 @@ export default class OutletTests extends ControllerTestCase(OutletController) { ` get identifiers() { - return ["test", "alpha", "beta", "gamma", "delta", "omega", "namespaced--epsilon"] + return ["test", "alpha", "beta", "gamma", "delta", "omega", "namespaced--epsilon", "helpers--common--input"] } "test OutletSet#find"() { @@ -366,4 +369,14 @@ export default class OutletTests extends ControllerTestCase(OutletController) { `expected "${alpha2.className}" to contain "disconnected"` ) } + + "test outlet renaming"() { + const element = this.findElement(".inputs") + const inputOutlet = this.controller.application.getControllerForElementAndIdentifier( + element, + "helpers--common--input" + ) + this.assert.equal(this.controller.inputOutlet, inputOutlet) + this.assert.equal(this.controller.inputOutletElement, element) + } } From ee061574b463f15123e9e09b817b01ac78a5f9d8 Mon Sep 17 00:00:00 2001 From: Imanpal Singh Date: Sat, 7 Sep 2024 14:30:38 +0530 Subject: [PATCH 3/3] Reverse the order of defining the rename --- src/core/outlet_observer.ts | 19 ++++++++++--------- src/core/outlet_properties.ts | 2 +- src/tests/controllers/outlet_controller.ts | 2 +- 3 files changed, 12 insertions(+), 11 deletions(-) diff --git a/src/core/outlet_observer.ts b/src/core/outlet_observer.ts index 2d606563..8bcae6fc 100644 --- a/src/core/outlet_observer.ts +++ b/src/core/outlet_observer.ts @@ -5,6 +5,7 @@ import { Context } from "./context" import { Controller } from "./controller" import { readInheritableStaticArrayValues } from "./inheritable_statics" +import { OutletRenameObject } from "./outlet_properties" type OutletObserverDetails = { outletName: string } @@ -206,15 +207,15 @@ export class OutletObserver implements AttributeObserverDelegate, SelectorObserv const constructor = module.definition.controllerConstructor const outlets = readInheritableStaticArrayValues(constructor, "outlets") - outlets.forEach((outlet) => { - let name; - if (typeof outlet === 'object') { - name = Object.keys(outlet)[0] - } else { - name = outlet; - } - return dependencies.add(name, module.identifier) - }); + outlets.forEach((outlet: string | OutletRenameObject) => { + let name: string + if (typeof outlet === "object") { + name = Object.values(outlet)[0] + } else { + name = outlet + } + return dependencies.add(name, module.identifier) + }) }) return dependencies diff --git a/src/core/outlet_properties.ts b/src/core/outlet_properties.ts index b48e967c..7cbce1a6 100644 --- a/src/core/outlet_properties.ts +++ b/src/core/outlet_properties.ts @@ -29,7 +29,7 @@ function propertiesForOutletDefinition(outletDescription: string | OutletRenameO let name: string; if (typeof outletDescription === 'object') { - const [[originalName, newName]] = Object.entries(outletDescription) + const [[newName, originalName]] = Object.entries(outletDescription) name = originalName camelizedName = namespaceCamelize(newName) } else { diff --git a/src/tests/controllers/outlet_controller.ts b/src/tests/controllers/outlet_controller.ts index c2edac6f..9104f5fe 100644 --- a/src/tests/controllers/outlet_controller.ts +++ b/src/tests/controllers/outlet_controller.ts @@ -13,7 +13,7 @@ class BaseOutletController extends Controller { export class OutletController extends BaseOutletController { static classes = ["connected", "disconnected"] - static outlets = ["beta", "gamma", "delta", "omega", "namespaced--epsilon", { "helpers--common--input": "input" }] + static outlets = ["beta", "gamma", "delta", "omega", "namespaced--epsilon", { input: "helpers--common--input" }] static values = { alphaOutletConnectedCallCount: Number,