Convert onSwap widgets to custom elements (issue #18)
Replaces the four onSwap-based widgets with TypeScript custom elements following the pattern from PR #16. Each widget gets a class extending HTMLElement with connectedCallback/disconnectedCallback, typed props via register_element + gen_element_types codegen, and lives in ts/elements/. - range-slider: RangeSliderElement; Python uses _RangeSlider builder - date-range-picker: DateRangePickerElement; Python uses _DateRangePicker builder - search-select: SearchSelectElement; Python uses _SearchSelect builder; data-* attrs become plain attrs (data-name -> name, data-search-url -> search-url, etc.) - filter-bar: FilterBarElement; props carry preset URLs; onclick/onsubmit attrs replaced with data-filter-bar-* sentinel attrs; all window.* globals removed Deletes ts/range_slider.ts, ts/search_select.ts, ts/date_range_picker.ts, ts/filter_bar.ts. Updates all tests and e2e pages to use the new element selectors and script paths (dist/elements/<tag>.js). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -24,7 +24,7 @@ def selection_fields_view(request):
|
||||
<html>
|
||||
<head>
|
||||
<script src="/static/js/htmx.min.js"></script>
|
||||
<script type="module" src="/static/js/dist/search_select.js"></script>
|
||||
<script type="module" src="/static/js/dist/elements/search-select.js"></script>
|
||||
<script type="module" src="/static/js/dist/elements/selection-fields.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
@@ -66,7 +66,7 @@ urlpatterns = [
|
||||
def test_selection_fields_syncs_with_source(live_server, page: Page):
|
||||
page.goto(live_server.url + "/sf-test/")
|
||||
|
||||
games = page.locator('[data-search-select][data-name="games"]')
|
||||
games = page.locator('search-select[name="games"]')
|
||||
rows = page.locator("selection-fields [data-selection-fields-rows] input")
|
||||
|
||||
# Below min_items (2): nothing rendered.
|
||||
@@ -112,7 +112,7 @@ def authenticated_page(live_server, page: Page, django_user_model) -> Page:
|
||||
|
||||
|
||||
def _select_two_games(page: Page) -> None:
|
||||
games = page.locator('[data-search-select][data-name="games"]')
|
||||
games = page.locator('search-select[name="games"]')
|
||||
games.locator("[data-search-select-search]").click()
|
||||
options = games.locator("[data-search-select-option]")
|
||||
expect(options).to_have_count(2) # prefetched on focus
|
||||
|
||||
Reference in New Issue
Block a user