Fix search bar TS tests (#2196)

* Implement LayerManager using LitElement + anywidget

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Update static files

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Use non-minified JS files to work around property renaming issue

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Set up tests for layer_manager_row

* Set up layer_manager_row test

* Implement LayerManager using LitElement + anywidget

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Update static files

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Use non-minified JS files to work around property renaming issue

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Clean up setuptools references in pyproject.toml

* Clean up setuptools references in pyproject.toml

* Fix dark mode and drop shadow issues in Colab

* Remove common.css, load fonts using JS instead.

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Rebuild

* Remove extraneous files

* Address comments from initial review

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Ignore static files

* Fix TS errors

* Convert tsconfig.json to spaces and export model interfaces

* Add TS tests for anywidgets

* Add a tab panel component

* clean up styles

* Add css classes for better testability

* Add better css classes (p2), build before test

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Add a rough basemap-selector widget

* Implement Inspector using anywidget and LitElement

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Add a tab panel and rough toolbar

* Add tests for basemap selector widget

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Increase margin to 4px

* Add working, rough toolbar (broken layer_manager)

* Add None check to plot tool

* Return empty list for extra tools in core

* Unbreak layer_manager

* Make sure rerendering preserves tab index

* Use primary styling to match old style

* Support dark mode better

* Fix toolbar unit tests

* Address review comments.

* Add type annotation

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Address review comments

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Address reviewer comments

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Extend LitWidget for ToolbarItem too

* Remove scratch file

* Fix core tests

* Implement search bar as anywidget (not working yet)

* Adjust margins

* Search bar MVP

* tab-clicked --> tab-changed

* tab-clicked --> tab-changed

* Move routines to helper methods

* Change info icon to point scan (cross-hair)

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Add reset button to location search

* Undo icon change

* Remove scratch file

* Add searchbar ts tests

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Add better comment about tooltip property

* Change some icons to match mocks

* Address review comments

* Search on enter

* Fix tests

---------

Co-authored-by: Nathaniel Schmitz <schmitznathaniel@gmail.com>
Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Co-authored-by: Qiusheng Wu <giswqs@gmail.com>

tests/search_bar.spec.ts

@@ -56,7 +56,7 @@ describe("<search-bar>", () => {
     });
 
     it("renders and updates the name address search", async () => {
-        searchBar.name_address_model = JSON.stringify({
+        searchBar.nameAddressModel = JSON.stringify({
             search: "my city",
             results: ["my city 1", "my city 2"],
             selected: "my city 1",
@@ -73,18 +73,19 @@ describe("<search-bar>", () => {
 
         jasmine.clock().install();
         searchBar.nameAddressSearch.value = "my new search";
-        searchBar.nameAddressSearch.dispatchEvent(new Event("input"));
+        searchBar.nameAddressSearch.dispatchEvent(new KeyboardEvent('keydown', { 'key': 'Enter' }));
         jasmine.clock().tick(500);
-        expect(JSON.parse(searchBar.name_address_model).search).toBe("my new search");
+        await searchBar.updateComplete;
+        expect(JSON.parse(searchBar.nameAddressModel).search).toBe("my new search");
         jasmine.clock().uninstall();
 
         searchBar.nameAddressResults[1].checked = true;
         searchBar.nameAddressResults[1].dispatchEvent(new Event("input"));
-        expect(JSON.parse(searchBar.name_address_model).selected).toBe("my city 2");
+        expect(JSON.parse(searchBar.nameAddressModel).selected).toBe("my city 2");
     });
 
     it("renders and updates the lat-lon search", async () => {
-        searchBar.lat_lon_model = JSON.stringify({
+        searchBar.latLonModel = JSON.stringify({
             search: "40, -100",
             results: ["my cool city"],
             selected: "my cool city",
@@ -101,14 +102,15 @@ describe("<search-bar>", () => {
 
         jasmine.clock().install();
         searchBar.latLonSearch.value = "my new search";
-        searchBar.latLonSearch.dispatchEvent(new Event("input"));
+        searchBar.latLonSearch.dispatchEvent(new KeyboardEvent('keydown', { 'key': 'Enter' }));
         jasmine.clock().tick(500);
-        expect(JSON.parse(searchBar.lat_lon_model).search).toBe("my new search");
+        await searchBar.updateComplete;
+        expect(JSON.parse(searchBar.latLonModel).search).toBe("my new search");
         jasmine.clock().uninstall();
     });
 
     it("renders and updates the dataset search", async () => {
-        searchBar.dataset_model = JSON.stringify({
+        searchBar.datasetModel = JSON.stringify({
             search: "elevation",
             results: ["dataset 1", "dataset 2"],
             selected: "dataset 1",
@@ -120,9 +122,10 @@ describe("<search-bar>", () => {
 
         jasmine.clock().install();
         searchBar.datasetSearch.value = "my new search";
-        searchBar.datasetSearch.dispatchEvent(new Event("input"));
+        searchBar.datasetSearch.dispatchEvent(new KeyboardEvent('keydown', { 'key': 'Enter' }));
         jasmine.clock().tick(500);
-        expect(JSON.parse(searchBar.dataset_model).search).toBe("my new search");
+        await searchBar.updateComplete;
+        expect(JSON.parse(searchBar.datasetModel).search).toBe("my new search");
         jasmine.clock().uninstall();
     });
 });