Post History

Why is WAVE throwing an "empty button" error when there's a type attribute specified?

Running the [WAVE browser extension](https://wave.webaim.org/) on a site, I'm getting an "Empty button" error on a search submit box:

![Page with a search box opened. A red WAVE error is showing under the search submit icon, and an explanation of the error and the relevant HTML code are visible on the page, both provided below.](https://powerusers.codidact.com/uploads/tke22dh6ce1iu04oaimsh72v26nq)

> A \<button\> element is present that contains no text content (or alternative text), or an \<input type="submit"\>, \<input type="button"\>, or \<input type="reset"\> has an empty or missing value attribute.

The HTML that's highlighted as being responsible for this error shows as this, including a "type=" attribute:

```
<button type="submit" class="button is-filled is-outlined">
<i class="fa fa-search"></i>
</button>
```

The [source code](https://github.com/codidact/qpixel/blob/develop/app/views/layouts/_header.html.erb#L148) in Ruby for this element is this:

```
  <%= form_tag search_path, method: :get, role: 'search' do %>
    <div class="grid is-nowrap">
        <%= search_field_tag :search, params[:search], class: 'form-element' %>
        <div class="h-m-1">
          <%= button_tag type: :submit, class: 'button is-filled is-outlined', name: nil do %>
            <i class="fa fa-search"></i>
          <% end %>
        </div>
    </div>
  <% end %>
```

On a development instance running on localhost, I tried adding `input_type: :submit` to the `button_tag`, which results in `input_type="submit" ` being added to the HTML, but I'm still getting the same WAVE error.

Why is WAVE giving me this error even though there is a `type` attribute (or `input_type` attribute) specified, and how can I resolve it?