from bottle import template
from pytest import mark

@mark.parametrize('expected, params', [
    ("""<form id="filter" method="get" action="products">
<style>
.button-resize { font-size: 70%; }
@media screen and (min-width:35.5em){
    .button-resize { font-size: 75%; }
}
@media screen and (min-width:40em){
    .button-resize { font-size: 85%; }
}
@media screen and (min-width:64em){
    .button-resize { font-size: 100%; }
}
@media screen and (min-width:80em){
    .button-resize { font-size: 110%; }
}
</style>
<div class="pure-g">
  <div class="pure-u-1">
    <div class="pure-button-group" role="nav" style="padding: 1em 0 0;">
      <button class="button-resize pure-button" type="submit" formaction="trend" > Trend </button>
      <button class="button-resize pure-button" type="submit" formaction="products" disabled="true"> Products </button>
      <button class="button-resize pure-button" type="submit" formaction="categories" > Categories </button>
      <button class="button-resize pure-button" type="submit" formaction="groups" > Groups </button>
      <button class="button-resize pure-button" type="submit" formaction="tags" > Tags </button>
    </div>
  </div>
</div>
<div class="pure-g">
  <div class="pure-u-1">
    <div class="pure-button-group" role="action" style="padding: 1em 0 0;">
    <button class="button-resize pure-button" type="submit"> Apply </button>
    <button form="clear" class="button-resize pure-button" type="submit"> Clear </button>
    <button form="reload" class="button-resize pure-button" type="submit"> Reload </button>
    </div>
  </div>
</div>
  <div style="width: 0; height: 1em">
<input type="text" name="product" value="!Chicken Stir Fry" hidden="true"/>
<input type="text" name="category" value="!Beef" hidden="true"/>
<input type="text" name="group" value="Fish, Meat, Eggs" hidden="true"/>
<input type="text" name="tag" value="" hidden="true"/>
<input type="text" name="unit" value="kg" hidden="true"/>
  </div>
</form>
<form id="clear" method="get" action="products">
  <div style="width: 0; height: 0">
<input type="text" name="product" value="" hidden="true"/>
<input type="text" name="category" value="" hidden="true"/>
<input type="text" name="group" value="" hidden="true"/>
<input type="text" name="tag" value="" hidden="true"/>
<input type="text" name="unit" value="" hidden="true"/>
  </div>
</form>
<form id="reload" method="get" action="products">
  <div style="width: 0; height: 0">
<input type="text" name="product" value="!Chicken Stir Fry" hidden="true"/>
<input type="text" name="category" value="!Beef" hidden="true"/>
<input type="text" name="group" value="Fish, Meat, Eggs" hidden="true"/>
<input type="text" name="tag" value="" hidden="true"/>
<input type="text" name="unit" value="kg" hidden="true"/>
<input type="text" name="reload" value="true" hidden="true"/>
  </div>
</form>""", {
    "method": "get", "action": "products", "params": [
        {'name': 'product', 'value': '!Chicken Stir Fry'},
        {'name': 'category', 'value': '!Beef'},
        {'name': 'group', 'value': 'Fish, Meat, Eggs'},
        {'name': 'tag'},
        {'name': 'unit', 'value': 'kg'},
    ]})
])
def test_form_nav_render_exact(expected, params):
    assert template('form-nav', **params) == expected