LiveSelect - Dynamic selection input component for LiveView

[trisolaran]

@egeersoz

n the short term, is there a way to inspect the HTML markup of the dropdown menu? It automatically closes when using the Inspect tool in Chrome!

There’s tricks on how to inspect content that disappear automatically when focus is lost. The easiest I know of is this one.

@egeersoz

Specifically, I’d like to write a test with the following steps:

1. Click on the input and type “Ala”
2. Assert that the dropdown field contains states with the text, e.g. “Alabama”
3. Click “Alabama”
4. Assert that “Alabama” got added to the selected_states assign
5. Click the X on the “Alabama” tag
6. Assert that “Alabama” got removed from the assign

Most of this test has little value because it’s not testing your code but a library that’s already tested. There’s already tests in the live select test suite that check that the dropdown is correctly filled with elements, that clicking on “x” removes tags, etc.

Your tests should test your own code

@egeersoz

Speaking of testing, what is the testing strategy for a component that uses LiveSelect?

You test it like any other input element: send the form’s data using render_submit or render_change and test that your view (or component) is reacting as you expect.

The only caveat is that the input value is sent with an hidden input, so you can’t use form to set the value, you have to do it in the render_submit call.