[Bug Fix] Accordion: fix misnamed test and rebuild MCP registry (#433)

Rename `test_open_content_does_not_have_hidden` to `test_open_item_wires_stimulus_open_value`,
add a `Visible content` assertion, and clarify comments to accurately describe
that the hidden attribute is removed at JS runtime (not server-render time).
Addresses code-review finding from cubic (confidence 9).

Also rebuild mcp/data/registry.json to include the accordion_content.rb and
accordion_controller.js changes from this PR so CI "MCP registry up to date" passes.

Author: djalmaaraujo

gem/test/ruby_ui/accordion_test.rb

@@ -122,7 +122,7 @@ def test_closed_content_has_data_state_closed
     assert_match(/data-state="closed"/, output)
   end
 
-  def test_open_content_does_not_have_hidden
+  def test_open_item_wires_stimulus_open_value
     output = phlex do
       RubyUI.Accordion do
         RubyUI.AccordionItem(open: true) do
@@ -134,14 +134,16 @@ def test_open_content_does_not_have_hidden
       end
     end
 
-    # When open: true the JS controller removes hidden on connect —
-    # but at the Ruby/HTML level the content still starts with hidden.
-    # The Stimulus controller handles removal at runtime. What we can assert
-    # at the structural level is that the item is wired up with open: true
-    # (Phlex renders boolean true as a bare attribute, no ="true").
+    # The Stimulus controller removes `hidden` and sets data-state="open" at
+    # runtime (JS). At the server-rendered HTML level we assert that the
+    # AccordionItem is wired up with the open value set to true so the
+    # controller reveals it on connect. Phlex renders `open: true` as a bare
+    # data attribute (no ="true"), so we confirm the attribute is present and
+    # NOT set to the false string.
     assert_match(/data-ruby-ui--accordion-open-value/, output)
-    # Confirm the open: true value is set (bare attribute without ="false")
     refute_match(/data-ruby-ui--accordion-open-value="false"/, output)
+    # The content is present in the DOM (server-rendered)
+    assert_match(/Visible content/, output)
   end
 
   # Structural test: a FormField with a FormFieldError nested inside a closed

mcp/data/registry.json

@@ -11,11 +11,11 @@
         },
         {
           "path": "accordion_content.rb",
-          "content": "# frozen_string_literal: true\n\nmodule RubyUI\n  class AccordionContent < Base\n    def view_template(&)\n      div(**attrs, &)\n    end\n\n    private\n\n    def default_attrs\n      {\n        data: {\n          ruby_ui__accordion_target: \"content\"\n        },\n        class: \"overflow-y-hidden\",\n        style: \"height: 0px;\"\n      }\n    end\n  end\nend\n"
+          "content": "# frozen_string_literal: true\n\nmodule RubyUI\n  class AccordionContent < Base\n    def view_template(&)\n      div(**attrs, &)\n    end\n\n    private\n\n    def default_attrs\n      {\n        data: {\n          ruby_ui__accordion_target: \"content\",\n          state: \"closed\"\n        },\n        class: \"overflow-y-hidden\",\n        style: \"height: 0px;\",\n        hidden: true\n      }\n    end\n  end\nend\n"
         },
         {
           "path": "accordion_controller.js",
-          "content": "import { Controller } from \"@hotwired/stimulus\";\nimport { animate } from \"motion\";\n\n// Connects to data-controller=\"ruby-ui--accordion\"\nexport default class extends Controller {\n  static targets = [\"icon\", \"content\"];\n  static values = {\n    open: {\n      type: Boolean,\n      default: false,\n    },\n    animationDuration: {\n      type: Number,\n      default: 0.15, // Default animation duration (in seconds)\n    },\n    animationEasing: {\n      type: String,\n      default: \"ease-in-out\", // Default animation easing\n    },\n    rotateIcon: {\n      type: Number,\n      default: 180, // Default icon rotation (in degrees)\n    },\n  };\n\n  connect() {\n    // Set the initial state of the accordion\n    let originalAnimationDuration = this.animationDurationValue;\n    this.animationDurationValue = 0;\n    this.openValue ? this.open() : this.close();\n    this.animationDurationValue = originalAnimationDuration;\n  }\n\n  // Toggle the 'open' value\n  toggle() {\n    this.openValue = !this.openValue;\n  }\n\n  // Handle changes in the 'open' value\n  openValueChanged(isOpen, wasOpen) {\n    if (isOpen) {\n      this.open();\n    } else {\n      this.close();\n    }\n  }\n\n  // Open the accordion content\n  open() {\n    if (this.hasContentTarget) {\n      this.revealContent();\n      this.hasIconTarget && this.rotateIcon();\n      this.openValue = true;\n    }\n  }\n\n  // Close the accordion content\n  close() {\n    if (this.hasContentTarget) {\n      this.hideContent();\n      this.hasIconTarget && this.rotateIcon();\n      this.openValue = false;\n    }\n  }\n\n  // Reveal the accordion content with animation\n  revealContent() {\n    const contentHeight = this.contentTarget.scrollHeight;\n    animate(\n      this.contentTarget,\n      { height: `${contentHeight}px` },\n      {\n        duration: this.animationDurationValue,\n        easing: this.animationEasingValue,\n      },\n    );\n  }\n\n  // Hide the accordion content with animation\n  hideContent() {\n    animate(\n      this.contentTarget,\n      { height: 0 },\n      {\n        duration: this.animationDurationValue,\n        easing: this.animationEasingValue,\n      },\n    );\n  }\n\n  // Rotate the accordion icon 180deg using animate function\n  rotateIcon() {\n    animate(this.iconTarget, {\n      rotate: `${this.openValue ? this.rotateIconValue : 0}deg`,\n    });\n  }\n}\n"
+          "content": "import { Controller } from \"@hotwired/stimulus\";\nimport { animate } from \"motion\";\n\n// Connects to data-controller=\"ruby-ui--accordion\"\nexport default class extends Controller {\n  static targets = [\"icon\", \"content\"];\n  static values = {\n    open: {\n      type: Boolean,\n      default: false,\n    },\n    animationDuration: {\n      type: Number,\n      default: 0.15, // Default animation duration (in seconds)\n    },\n    animationEasing: {\n      type: String,\n      default: \"ease-in-out\", // Default animation easing\n    },\n    rotateIcon: {\n      type: Number,\n      default: 180, // Default icon rotation (in degrees)\n    },\n  };\n\n  connect() {\n    // Set the initial state of the accordion\n    let originalAnimationDuration = this.animationDurationValue;\n    this.animationDurationValue = 0;\n    this.openValue ? this.open() : this.close();\n    this.animationDurationValue = originalAnimationDuration;\n  }\n\n  // Toggle the 'open' value\n  toggle() {\n    this.openValue = !this.openValue;\n  }\n\n  // Handle changes in the 'open' value\n  openValueChanged(isOpen, wasOpen) {\n    if (isOpen) {\n      this.open();\n    } else {\n      this.close();\n    }\n  }\n\n  // Open the accordion content\n  open() {\n    if (this.hasContentTarget) {\n      this.revealContent();\n      this.hasIconTarget && this.rotateIcon();\n      this.openValue = true;\n    }\n  }\n\n  // Close the accordion content\n  close() {\n    if (this.hasContentTarget) {\n      this.hideContent();\n      this.hasIconTarget && this.rotateIcon();\n      this.openValue = false;\n    }\n  }\n\n  // Reveal the accordion content with animation\n  revealContent() {\n    const content = this.contentTarget;\n\n    // Remove hidden so the element participates in layout before measuring\n    content.removeAttribute(\"hidden\");\n    content.dataset.state = \"open\";\n\n    const contentHeight = content.scrollHeight;\n    animate(\n      content,\n      { height: `${contentHeight}px` },\n      {\n        duration: this.animationDurationValue,\n        easing: this.animationEasingValue,\n      },\n    );\n  }\n\n  // Hide the accordion content with animation\n  hideContent() {\n    const content = this.contentTarget;\n    content.dataset.state = \"closed\";\n\n    animate(\n      content,\n      { height: 0 },\n      {\n        duration: this.animationDurationValue,\n        easing: this.animationEasingValue,\n      },\n    ).finished.then(() => {\n      // After animation completes, truly hide the element so it is removed\n      // from layout and form focus — prevents trapped validation errors\n      if (content.dataset.state === \"closed\") {\n        content.setAttribute(\"hidden\", \"\");\n      }\n    });\n  }\n\n  // Rotate the accordion icon 180deg using animate function\n  rotateIcon() {\n    animate(this.iconTarget, {\n      rotate: `${this.openValue ? this.rotateIconValue : 0}deg`,\n    });\n  }\n}\n"
         },
         {
           "path": "accordion_default_content.rb",