Create a trixeditor controller and broadcast a change event on form

Therefore, AngularJS can set form as dirty

+ add associated spec

app/views/admin/enterprises/form/_white_label.html.haml

@@ -60,4 +60,4 @@
         = custom_tab_form.label :content, t('.custom_tab_content')
       .thirteen.columns
         = custom_tab_form.hidden_field :content, id: "custom_tab_content"
-        %trix-editor{ input: "custom_tab_content" }
+        %trix-editor{ input: "custom_tab_content", "data-controller": "trixeditor" }

app/webpacker/controllers/trixeditor_controller.js

@@ -0,0 +1,12 @@
+import { Controller } from "stimulus";
+
+export default class extends Controller {
+  connect() {
+    window.addEventListener("trix-change", this.#trixChange);
+  }
+
+  #trixChange = (event) => {
+    // trigger a change event on the form that contains the Trix editor
+    event.target.form.dispatchEvent(new Event("change", { bubbles: true }));
+  };
+}

spec/system/admin/enterprises_spec.rb

@@ -774,6 +774,18 @@ describe '
               expect(page).to have_content("Custom tab content")
             end
 
+            it "enable the update button on custom tab content change" do
+              fill_in_trix_editor "custom_tab_content", with: "Custom tab content changed"
+              within "save-bar" do
+                expect(page).to have_button("Update", disabled: false)
+              end
+              expect {
+                click_button 'Update'
+              }.to change { distributor1.reload.custom_tab.content }
+                .from("Custom tab content")
+                .to("<div>Custom tab content changed</div>")
+            end
+
             it "can delete custom tab if uncheck the checkbox" do
               uncheck "Create custom tab in shopfront"
               click_button 'Update'