0

I'm updating some old code to be ADA compliant and need to give each <li> in the nav tabindex="0" so they are all accessible via keyboard.

This is the code that generates the navigation <li>s. It wasn't written by me and I only knew what Arbre was because a senior dev pointed it out but neither of us are sure how to add the tabindex.

def nav_item_column_list(nav_item, row_number, column_number)
sub_item = nav_item.children.where(column_number: column_number).all[row_number]

if sub_item.present?
  Arbre::Context.new({:helper => self}) do
    ul do
      li do
        a sub_item.title, href: sub_item.url
        if sub_item.children.count > 0
          ul do
            sub_item.children.each do |child|
              li do
                a child.title, href: child.url
              end
            end
          end
        end
      end
    end
  end
end

end

1 Answers1

0

While the documentation is compact, it says

Tag attributes including id and HTML classes are passed as a hash parameter and the tag body is passed as a block

So I would guess you could write something like

li tabindex: 0 do 

So I tested this:

Arbre::Context.new { li tabindex: 0 }
=> <li tabindex="0"></li>
nathanvda
  • 49,707
  • 13
  • 117
  • 139
  • I tried this and am not seeing the tabindex being added. – haste410 Dec 19 '19 at 17:14
  • Ok, I installed the gem and tried it and afaik it just works (I edited my answer). How did you try it? – nathanvda Dec 19 '19 at 19:21
  • I replaced `li do` with `li tabindex: 0 do `In your edited answer, where would `Arbre::Context.new { li tabindex: 0 } =>
  • ` go in the code I posted? I have never used Arbre before and this is the only part of the site I've seen use it so I am very lost as to how it works. – haste410 Dec 19 '19 at 20:39
  • Did you read the documentation? `Arbre::Context.new` takes a block, so you should do exactly the same. Did you replace all occurences of `li` (because it occurs mulitple times? I am guessing the top-level is most important? How did you verify it did/did not work? Can you test the method and check the output in the `rails console`? Or is there any test coverage? – nathanvda Dec 20 '19 at 10:47