Skip to content

Commit

Permalink
Add config to control boldening of radio labels
Browse files Browse the repository at this point in the history
The original behaviour of the form builder followed the examples in the
Design System documentation at the time and emboldened any radio button
labels when hints were present.

These examples were dropped in 2020[0] and the guidance changed. In the
referenced PR I said I'd look into changing the behaviour in the form
builder but never did.

As it would be a breaking change we're just adding a new configuration
option, `default_collection_radio_buttons_auto_bold_labels`, to allow
the behaviour to be modified.

[0] alphagov/govuk-design-system#1284
  • Loading branch information
peteryates committed Jul 19, 2022
1 parent 9575a00 commit 44bd340
Show file tree
Hide file tree
Showing 5 changed files with 87 additions and 8 deletions.
8 changes: 5 additions & 3 deletions guide/content/form-elements/radios.slim
Original file line number Diff line number Diff line change
Expand Up @@ -39,9 +39,11 @@ p.govuk-body
null or empty no hint will be rendered.

p.govuk-body
| When descriptions are enabled in a radio button collection the labels are
made <strong>bold</strong> by default. This provides additional contrast
and makes the labels stand out from the hint.
| When descriptions are enabled in a radio button collection the labels are made
<strong>bold</strong> by default. This makes the labels stand out from the hints.
The auto bolding behaviour can be disabled by changing the
<code>default_collection_radio_buttons_auto_bold_labels</code>
configuration flag to <code>false</code>.

== render('/partials/example.*',
caption: 'Small radios',
Expand Down
6 changes: 6 additions & 0 deletions lib/govuk_design_system_formbuilder.rb
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,11 @@ module GOVUKDesignSystemFormBuilder
# * +:default_collection_radio_buttons_include_hidden+ controls whether or not
# a hidden field is added when rendering a collection of radio buttons
#
# * +:default_collection_radio_buttons_auto_bold_labels+ will automatically
# make labels on {#govuk_collection_radio_buttons} bold when a +:hint_method+
# is present. The default can be overridden using the +bold_labels:+ argument.
# The default value is 'true'.
#
# * +:default_error_summary_title+ sets the text used in error summary
# blocks. As per the GOV.UK Design System spec, it defaults to
# 'There is a problem'.
Expand Down Expand Up @@ -91,6 +96,7 @@ module GOVUKDesignSystemFormBuilder
default_error_summary_turbo_prefix: 'turbo',
default_collection_check_boxes_include_hidden: true,
default_collection_radio_buttons_include_hidden: true,
default_collection_radio_buttons_auto_bold_labels: true,
default_submit_validate: false,

localisation_schema_fallback: %i(helpers __context__),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,7 @@ def initialize(builder, object_name, attribute_name, collection, value_method:,
@classes = classes
@form_group = form_group
@include_hidden = include_hidden
@bold_labels = if bold_labels.nil?
hint_method.present?
else
bold_labels
end
@bold_labels = (bold_labels.nil? && auto_bold_labels?) || bold_labels
end

def html
Expand All @@ -38,6 +34,11 @@ def html

private

def auto_bold_labels?
(config.default_collection_radio_buttons_auto_bold_labels &&
@hint_method.present?)
end

def fieldset_options
{
legend: @legend,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
describe GOVUKDesignSystemFormBuilder::FormBuilder do
include_context 'setup builder'
include_context 'setup examples'

describe 'labels auto bolding config' do
specify %(the default should be to bold labels when hints are present) do
expect(GOVUKDesignSystemFormBuilder.config.default_collection_radio_buttons_auto_bold_labels).to be(true)
end

let(:label_selector) { 'label.govuk-label' }
let(:bold_label_selector) { label_selector + '--s' }
let(:method) { :govuk_collection_radio_buttons }
let(:attribute) { :favourite_shape }

let(:shapes) do
[
OpenStruct.new(id: 't', name: 'Triangle', description: 'A three-edged polygon'),
OpenStruct.new(id: 's', name: 'Square', description: 'A regular quadrilateral'),
OpenStruct.new(id: 'p', name: 'Pentagon'),
OpenStruct.new(id: 'h', name: 'Hexagon'),
]
end

let(:args) { [method, attribute, shapes, :id, :name, :description] }
let(:kwargs) { {} }

subject { builder.send(*args, **kwargs) }

context 'when default_collection_radio_buttons_auto_bold_labels is set to true' do
specify 'all of the labels are bold' do
expect(subject).to have_tag(label_selector, count: shapes.size)
expect(subject).to have_tag(bold_label_selector, count: shapes.size)
end

context %(when the default is overriden with the 'bold_labels' argument) do
let(:kwargs) { { bold_labels: false } }

specify 'none of the labels are bold' do
expect(subject).to have_tag(label_selector, count: shapes.size)
expect(subject).not_to have_tag(bold_label_selector)
end
end
end

context 'when default_collection_radio_buttons_auto_bold_labels is set to false' do
before do
GOVUKDesignSystemFormBuilder.configure do |conf|
conf.default_collection_radio_buttons_auto_bold_labels = false
end
end

after { GOVUKDesignSystemFormBuilder.reset! }

specify 'none of the labels are bold' do
expect(subject).to have_tag(label_selector, count: shapes.size)
expect(subject).not_to have_tag(bold_label_selector)
end

context %(when the default is overriden with the 'bold_labels' argument) do
let(:kwargs) { { bold_labels: true } }

specify 'all of the labels are bold' do
expect(subject).to have_tag(label_selector, count: shapes.size)
expect(subject).to have_tag(bold_label_selector, count: shapes.size)
end
end
end
end
end
1 change: 1 addition & 0 deletions spec/support/examples.rb
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ class Being
:stationery,
:stationery_choice,
:hairstyle,
:favourite_shape,
)

def initialize(_args = nil)
Expand Down

0 comments on commit 44bd340

Please sign in to comment.