diff --git a/app/assets/javascripts/discourse/app/lib/plugin-api.js b/app/assets/javascripts/discourse/app/lib/plugin-api.js index c791f4b3fbb..27fb8847508 100644 --- a/app/assets/javascripts/discourse/app/lib/plugin-api.js +++ b/app/assets/javascripts/discourse/app/lib/plugin-api.js @@ -949,6 +949,8 @@ class PluginApi { } /** + * @deprecated + * * Register a Connector class for a particular outlet and connector. * * For example, if the outlet is `user-profile-primary` and your connector @@ -962,8 +964,8 @@ class PluginApi { * }); * ``` * - * For more information on connector classes, see: - * https://meta.discourse.org/t/important-changes-to-plugin-outlets-for-ember-2-10/54136 + * This API is deprecated. See renderIntoOutlet instead. + * **/ registerConnectorClass(outletName, connectorName, klass) { extraConnectorClass(`${outletName}/${connectorName}`, klass); diff --git a/app/assets/javascripts/discourse/app/lib/plugin-connectors.js b/app/assets/javascripts/discourse/app/lib/plugin-connectors.js index 066a8e5a8a8..f3c8f7eda44 100644 --- a/app/assets/javascripts/discourse/app/lib/plugin-connectors.js +++ b/app/assets/javascripts/discourse/app/lib/plugin-connectors.js @@ -20,6 +20,10 @@ export function resetExtraClasses() { // Note: In plugins, define a class by path and it will be wired up automatically // eg: discourse/connectors// export function extraConnectorClass(name, obj) { + deprecated( + "Defining connector classes via registerConnectorClass is deprecated. See https://meta.discourse.org/t/32727 for more modern patterns.", + { id: "discourse.register-connector-class-legacy" } + ); _extraConnectorClasses[name] = obj; } diff --git a/app/assets/javascripts/discourse/tests/integration/components/plugin-outlet-test.gjs b/app/assets/javascripts/discourse/tests/integration/components/plugin-outlet-test.gjs index 54edd5d6954..1e3c14b480e 100644 --- a/app/assets/javascripts/discourse/tests/integration/components/plugin-outlet-test.gjs +++ b/app/assets/javascripts/discourse/tests/integration/components/plugin-outlet-test.gjs @@ -12,7 +12,10 @@ import { import { setupRenderingTest } from "discourse/tests/helpers/component-test"; import { count, exists, query } from "discourse/tests/helpers/qunit-helpers"; import { registerTemporaryModule } from "discourse/tests/helpers/temporary-module-helper"; -import { withSilencedDeprecationsAsync } from "discourse-common/lib/deprecated"; +import { + withSilencedDeprecations, + withSilencedDeprecationsAsync, +} from "discourse-common/lib/deprecated"; const TEMPLATE_PREFIX = "discourse/plugins/some-plugin/templates/connectors"; const CLASS_PREFIX = "discourse/plugins/some-plugin/connectors"; @@ -21,7 +24,7 @@ module("Integration | Component | plugin-outlet", function (hooks) { setupRenderingTest(hooks); hooks.beforeEach(function () { - extraConnectorClass("test-name/hello", { + registerTemporaryModule(`${CLASS_PREFIX}/test-name/hello`, { actions: { sayHello() { this.set("hello", `${this.hello || ""}hello!`); @@ -29,7 +32,7 @@ module("Integration | Component | plugin-outlet", function (hooks) { }, }); - extraConnectorClass("test-name/hi", { + registerTemporaryModule(`${CLASS_PREFIX}/test-name/hi`, { setupComponent() { this.appEvents.on("hi:sayHi", this, this.say); }, @@ -49,7 +52,7 @@ module("Integration | Component | plugin-outlet", function (hooks) { }, }); - extraConnectorClass("test-name/conditional-render", { + registerTemporaryModule(`${CLASS_PREFIX}/test-name/conditional-render`, { shouldRender(args, context) { return args.shouldDisplay || context.siteSettings.always_display; }, @@ -124,17 +127,23 @@ module("Integration | Component | plugin-outlet", function (hooks) { this.set("yieldCore", false); this.set("enableClashingConnector", false); - extraConnectorClass("outlet-with-default/my-connector", { - shouldRender(args) { - return args.shouldDisplay; - }, - }); + registerTemporaryModule( + `${CLASS_PREFIX}/outlet-with-default/my-connector`, + { + shouldRender(args) { + return args.shouldDisplay; + }, + } + ); - extraConnectorClass("outlet-with-default/clashing-connector", { - shouldRender(args) { - return args.enableClashingConnector; - }, - }); + registerTemporaryModule( + `${CLASS_PREFIX}/outlet-with-default/clashing-connector`, + { + shouldRender(args) { + return args.enableClashingConnector; + }, + } + ); this.template = hbs` @@ -315,7 +324,7 @@ module( test("uses simple object if provided", async function (assert) { this.set("someBoolean", true); - extraConnectorClass("test-name/my-connector", { + registerTemporaryModule(`${CLASS_PREFIX}/test-name/my-connector`, { shouldRender(args) { return args.someBoolean; }, @@ -343,7 +352,7 @@ module( }); test("ignores classic hooks for glimmer components", async function (assert) { - extraConnectorClass("test-name/my-connector", { + registerTemporaryModule(`${CLASS_PREFIX}/test-name/my-connector`, { setupComponent(args, component) { component.reopen({ get hello() { @@ -369,8 +378,8 @@ module( test("uses custom component class if provided", async function (assert) { this.set("someBoolean", true); - extraConnectorClass( - "test-name/my-connector", + registerTemporaryModule( + `${CLASS_PREFIX}/test-name/my-connector`, class MyOutlet extends Component { static shouldRender(args) { return args.someBoolean; @@ -398,8 +407,8 @@ module( test("uses custom templateOnly() if provided", async function (assert) { this.set("someBoolean", true); - extraConnectorClass( - "test-name/my-connector", + registerTemporaryModule( + `${CLASS_PREFIX}/test-name/my-connector`, Object.assign(templateOnly(), { shouldRender(args) { return args.someBoolean; @@ -472,3 +481,32 @@ module("Integration | Component | plugin-outlet | tagName", function (hooks) { assert.dom("div").exists(); }); }); + +module( + "Integration | Component | plugin-outlet | legacy extraConnectorClass", + function (hooks) { + setupRenderingTest(hooks); + + hooks.beforeEach(function () { + registerTemporaryModule( + `${TEMPLATE_PREFIX}/test-name/my-legacy-connector`, + hbs`Hello world {{this.someVar}}` + ); + + withSilencedDeprecations( + "discourse.register-connector-class-legacy", + () => + extraConnectorClass("test-name/my-legacy-connector", { + setupComponent(outletArgs, component) { + component.set("someVar", "from legacy"); + }, + }) + ); + }); + + test("links up template with extra connector class", async function (assert) { + await render(hbs``); + assert.dom(".legacy-test").hasText("Hello world from legacy"); + }); + } +);