a2f6e03516
Since forms are landmarks, screen reader users might navigate to the form. But then they were going to find an empty form with no way to toggle it. Moving the button inside the form means screen reader users navigating to the form will find the button to toggle it. It also helps us simplifying the code; there's no need to use data-attributes to communicate whether the form should be visible since now we can easily use the button `aria-expanded` attribute. We could further simplify the JavaScript if we used a CSS rule to show/hide the form fields based on the toggle button `aria-expanded` attribute. However, implementing the "slide" animation we use when toggling the form with CSS is difficult and unreliable.
54 lines
1.5 KiB
Ruby
54 lines
1.5 KiB
Ruby
require "rails_helper"
|
|
|
|
describe Shared::AdvancedSearchComponent, type: :component do
|
|
let(:component) { Shared::AdvancedSearchComponent.new }
|
|
|
|
context "JavaScript disabled" do
|
|
it "renders the form" do
|
|
render_inline component
|
|
|
|
expect(page).to have_button "Filter"
|
|
end
|
|
|
|
it "hides the button to show the form" do
|
|
render_inline component
|
|
|
|
expect(page.find("form")).to have_button "Advanced search", visible: :hidden
|
|
end
|
|
end
|
|
|
|
describe "SDG filter" do
|
|
before do
|
|
Setting["feature.sdg"] = true
|
|
Setting["sdg.process.proposals"] = true
|
|
|
|
allow(component).to receive(:controller_path).and_return("proposals")
|
|
end
|
|
|
|
it "does not render when the feature is disabled" do
|
|
Setting["feature.sdg"] = false
|
|
|
|
render_inline component
|
|
|
|
expect(page).not_to have_selector "#advanced_search_goal", visible: :all
|
|
expect(page).not_to have_selector "#advanced_search_target", visible: :all
|
|
end
|
|
|
|
it "does not render when the SDG process feature is disabled" do
|
|
Setting["sdg.process.proposals"] = false
|
|
|
|
render_inline component
|
|
|
|
expect(page).not_to have_selector "#advanced_search_goal", visible: :all
|
|
expect(page).not_to have_selector "#advanced_search_target", visible: :all
|
|
end
|
|
|
|
it "renders when both features are enabled" do
|
|
render_inline component
|
|
|
|
expect(page).to have_selector "#advanced_search_goal", visible: :all
|
|
expect(page).to have_selector "#advanced_search_target", visible: :all
|
|
end
|
|
end
|
|
end
|