Repository: primer/view_components (Ruby)

Issue:
Button that submits a value
I want to render a button that submits a form with a named value like this:

```html
<button type="submit" name="remove_thing" value="some-id">Remove thing</button>
```

I can't seem to get this to work as you can't seem to change a button component to submit:

```rb
form.button(
  type: :submit,
  name: "remove_thing",
  value: "some-id",
  label: "Remove thing"
)
```

I've also tried using a `form.submit()` but the label overrides the value.

Is there some other way of doing this?


Discussion:
Thanks for letting us know.

@camertron given your knowledge of our forms setup, could you take a look at this and weigh in?
Hey @dereke, thanks for bringing this up! Seems like an oversight 😄 This PR should fix it: https://github.com/primer/view_components/pull/3141
thanks so much for this!



Patch:
diff --git a/.changeset/cuddly-games-prove.md b/.changeset/cuddly-games-prove.md
new file mode 100644
index 0000000000..376c13dd6a
--- /dev/null
+++ b/.changeset/cuddly-games-prove.md
@@ -0,0 +1,5 @@
+---
+'@primer/view-components': patch
+---
+
+Allow setting custom values on submit buttons.
diff --git a/app/lib/primer/forms/button.rb b/app/lib/primer/forms/button.rb
index b456420a3b..bc5a40ac3e 100644
--- a/app/lib/primer/forms/button.rb
+++ b/app/lib/primer/forms/button.rb
@@ -54,11 +54,14 @@ def input_arguments
       private
 
       def tag_attributes
+        attrs = { name: @input.name }
+        attrs[:value] = @input.value if @input.value
+
         case @type
         when :submit
-          ButtonAttributeGenerator.submit_tag_attributes(@input.label, name: @input.name)
+          ButtonAttributeGenerator.submit_tag_attributes(@input.label, **attrs)
         else
-          ButtonAttributeGenerator.button_tag_attributes(@input.label, name: @input.name)
+          ButtonAttributeGenerator.button_tag_attributes(@input.label, **attrs)
         end
       end
     end
diff --git a/app/lib/primer/forms/dsl/input.rb b/app/lib/primer/forms/dsl/input.rb
index d1280e8aca..e022525a86 100644
--- a/app/lib/primer/forms/dsl/input.rb
+++ b/app/lib/primer/forms/dsl/input.rb
@@ -246,6 +246,10 @@ def id
           @input_arguments[:id]
         end
 
+        def value
+          @input_arguments[:value]
+        end
+
         # :nocov:
         def name
           raise_for_abstract_method!(__method__)
@@ -305,7 +309,7 @@ def input_data
         def caption_template_name
           return nil unless name
 
-          @caption_template_name ||= if respond_to?(:value)
+          @caption_template_name ||= if respond_to?(:value) && value.present?
                                        :"#{name}_#{value}"
                                      else
                                        name.to_sym


Test patch:
diff --git a/test/lib/primer/forms/submit_button_input_test.rb b/test/lib/primer/forms/submit_button_input_test.rb
new file mode 100644
index 0000000000..b8e925fafb
--- /dev/null
+++ b/test/lib/primer/forms/submit_button_input_test.rb
@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+require "lib/test_helper"
+
+class Primer::Forms::SubmitButtonInputTest < Minitest::Test
+  include Primer::ComponentTestHelpers
+
+  def test_uses_name_as_value_by_default
+    render_in_view_context do
+      primer_form_with(url: "/foo") do |f|
+        render_inline_form(f) do |submit_button_form|
+          submit_button_form.submit(name: :foo, label: "Foo")
+        end
+      end
+    end
+
+    assert_selector "button[type=submit][value=Foo]"
+  end
+
+  def test_allows_overriding_value
+    render_in_view_context do
+      primer_form_with(url: "/foo") do |f|
+        render_inline_form(f) do |submit_button_form|
+          submit_button_form.submit(name: :foo, label: "Foo", value: "bar")
+        end
+      end
+    end
+
+    assert_selector "button[type=submit][value=bar]"
+  end
+end