I can bind multi-select

tests/controls/test_manage_binding.py

@@ -304,7 +304,109 @@ class TestBindingSelect:
 class TestBindingSelectMultiple:
   """Tests for binding Select components with multiple selection."""
   
-  def test_i_can_bind_select_multiple(self, user, rt):
+  def test_i_can_bind_select_multiple(self):
+    data = Data("")
+    select_elt = Select(
+      Option("Option 1", value="option1"),
+      Option("Option 2", value="option2"),
+      Option("Option 3", value="option3"),
+      name="select_name",
+      multiple=True
+    )
+    
+    binding = Binding(data)
+    updated = mk.manage_binding(select_elt, binding)
+    
+    expected = Select(
+      AttributeForbidden("hx_swap_oob"),
+      Option("Option 1", value="option1"),
+      Option("Option 2", value="option2"),
+      Option("Option 3", value="option3"),
+      name="select_name",
+      id=AnyValue(),
+      hx_post=f"{ROUTE_ROOT}{Routes.Bindings}",
+    )
+    assert matches(updated, expected)
+  
+  def test_i_can_update_one_selection(self):
+    data = Data("")
+    select_elt = Select(
+      Option("Option 1", value="option1"),
+      Option("Option 2", value="option2"),
+      Option("Option 3", value="option3"),
+      name="select_name",
+      multiple=True
+    )
+    
+    binding = Binding(data)
+    mk.manage_binding(select_elt, binding)
+    
+    res = binding.update({"select_name": "option2"})
+    
+    expected = Select(
+      Option("Option 1", value="option1"),
+      Option("Option 2", value="option2", selected="true"),
+      Option("Option 3", value="option3"),
+      name="select_name",
+      id=AnyValue(),
+      hx_post=f"{ROUTE_ROOT}{Routes.Bindings}",
+      hx_swap_oob="true"
+    )
+    assert matches(res, [expected])
+  
+  def test_i_can_update_multiple_selections(self):
+    data = Data("")
+    select_elt = Select(
+      Option("Option 1", value="option1"),
+      Option("Option 2", value="option2"),
+      Option("Option 3", value="option3"),
+      name="select_name",
+      multiple=True
+    )
+    
+    binding = Binding(data)
+    mk.manage_binding(select_elt, binding)
+    
+    res = binding.update({"select_name": ["option2", "option3"]})
+    
+    expected = Select(
+      Option(AttributeForbidden("selected"), "Option 1", value="option1"),
+      Option("Option 2", value="option2", selected="true"),
+      Option("Option 3", value="option3", selected="true"),
+      name="select_name",
+      id=AnyValue(),
+      hx_post=f"{ROUTE_ROOT}{Routes.Bindings}",
+      hx_swap_oob="true"
+    )
+    assert matches(res, [expected])
+  
+  def test_i_can_update_unselect(self):
+    data = Data(["option1", "option2", "option3"])
+    select_elt = Select(
+      Option("Option 1", value="option1", selected="true"),
+      Option("Option 2", value="option2", selected="true"),
+      Option("Option 3", value="option3", selected="true"),
+      name="select_name",
+      multiple=True
+    )
+    
+    binding = Binding(data)
+    mk.manage_binding(select_elt, binding)
+    
+    res = binding.update({})
+    
+    expected = Select(
+      Option(AttributeForbidden("selected"), "Option 1", value="option1"),
+      Option(AttributeForbidden("selected"), "Option 2", value="option2"),
+      Option(AttributeForbidden("selected"), "Option 3", value="option3"),
+      name="select_name",
+      id=AnyValue(),
+      hx_post=f"{ROUTE_ROOT}{Routes.Bindings}",
+      hx_swap_oob="true"
+    )
+    assert matches(res, [expected])
+  
+  def test_i_can_bind_select_multiple_with_label(self, user, rt):
     """
     Multiple select should bind with list data.
     Selecting multiple options should update the label.
@@ -360,7 +462,7 @@ class TestBindingSelectMultiple:
     
     testable_select = user.find_element("select")
     testable_select.deselect("option1")
-    user.should_see("['option2']")
+    user.should_see("option2")
 
 
 class TestBindingRange:

tests/testclient/test_testable_select_multiple.py

@@ -0,0 +1,107 @@
+import pytest
+from fasthtml.fastapp import fast_app
+
+from myfasthtml.test.testclient import TestableSelect, MyTestClient
+
+
+@pytest.fixture
+def test_app():
+  test_app, rt = fast_app(default_hdrs=False)
+  return test_app
+
+
+@pytest.fixture
+def rt(test_app):
+  return test_app.route
+
+
+@pytest.fixture
+def test_client(test_app):
+  return MyTestClient(test_app)
+
+
+def test_i_can_read_select(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1">Option 1</option>
+  <option value="option2">Option 2</option>
+  <option value="option3">Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  assert select_elt.name == "select_name"
+  assert select_elt.value == []
+  assert select_elt.options == [{'text': 'Option 1', 'value': 'option1'},
+                                {'text': 'Option 2', 'value': 'option2'},
+                                {'text': 'Option 3', 'value': 'option3'}]
+  assert select_elt.select_fields == {'select_name': [{'text': 'Option 1', 'value': 'option1'},
+                                                      {'text': 'Option 2', 'value': 'option2'},
+                                                      {'text': 'Option 3', 'value': 'option3'}]}
+  assert select_elt.is_multiple is True
+
+
+def test_i_can_read_select_with_multiple_selected_values(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1" selected>Option 1</option>
+  <option value="option2">Option 2</option>
+  <option value="option3" selected>Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  assert select_elt.name == "select_name"
+  assert select_elt.value == ["option1", "option3"]
+  assert select_elt.is_multiple is True
+
+
+def test_i_can_select_option(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1">Option 1</option>
+  <option value="option2">Option 2</option>
+  <option value="option3">Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  select_elt.select("option2")
+  assert select_elt.value == "option2"
+
+
+def test_i_can_select_multiple_options(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1">Option 1</option>
+  <option value="option2">Option 2</option>
+  <option value="option3">Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  select_elt.select("option2")
+  select_elt.select("option3")
+  assert select_elt.value == ["option2", "option3"]
+
+
+def test_i_can_select_by_text(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1">Option 1</option>
+  <option value="option2">Option 2</option>
+  <option value="option3">Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  select_elt.select_by_text("Option 3")
+  assert select_elt.value == "option3"
+
+
+def test_i_can_deselect(test_client):
+  html = '''<select name="select_name" multiple>
+  <option value="option1" selected>Option 1</option>
+  <option value="option2" selected>Option 2</option>
+  <option value="option3" selected>Option 3</option>
+  </select>
+  '''
+  select_elt = TestableSelect(test_client, html)
+  select_elt.deselect("option3")
+  assert select_elt.value == ["option1", "option2"]
+  
+  select_elt.deselect("option2")
+  assert select_elt.value == "option1"
+  
+  select_elt.deselect("option1")
+  assert select_elt.value == []