Select methods for adding/removing features by laundmo · Pull Request #16923 · openlayers/openlayers

laundmo · 2025-06-20T22:38:33Z

This PR fixes #16918 and fixes #16597

by adding the following (public) methods to the Select interaction:

selectFeature(feature) - selects a feature as if the user clicked it, only if it passes the filters (layer and filter function). sends a SelectEvent if its selected
deselectFeature(feature) - deselects a feature if its currently selected, sending a SelectEvent if it got deselected
toggleFeature(feature) - toggles a feature on and off, sends a SelectEvent depending on what happened
clearSelection() - remove all features from selection, sends a SelectEvent with all of them in .deselected

To accomplish this, i've added some private methods and migrated the mapBrowserEvent handling code to using them.

Examples are updated, i've utilized more features of Select for some of them.

Tests aren't run yet, due to issues (see below)

…CR" on every line

…clicked (applying filters, select events)

…d its features

laundmo · 2025-06-20T22:41:00Z

I was not able to run (and therefore write) tests, every single browser test was timing out after 2500ms with Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.. I have no idea why this is happening and would appreciate any help.

Heres a longer excerpt of running the tests

Chrome Headless 137.0.0.0 (Windows 10) ol/source/GeoTIFF loading manages load states FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: AggregateError: Request failed
AggregateError: Request failed
    at BlockedSource.fetch (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/source/blockedsource.js:153:1)
    at GeoTIFF.fromSource (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/geotiff.js:548:1)
    at async Promise.all (index 0)
Chrome Headless 137.0.0.0 (Windows 10) ol/source/GeoTIFF loading configures itself from source metadata FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: AggregateError: Request failed
AggregateError: Request failed
    at BlockedSource.fetch (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/source/blockedsource.js:153:1)
    at GeoTIFF.fromSource (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/geotiff.js:548:1)
    at async Promise.all (index 0)
Chrome Headless 137.0.0.0 (Windows 10) ol/source/GeoTIFF loading resolves view properties FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: AggregateError: Request failed
AggregateError: Request failed
    at BlockedSource.fetch (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/source/blockedsource.js:153:1)
    at GeoTIFF.fromSource (http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/node_modules/geotiff/dist-module/geotiff.js:548:1)
    at async Promise.all (index 0)
Chrome Headless 137.0.0.0 (Windows 10) ol/source/GeoTIFF loading loads tiles FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
................................................................................
..
ERROR: DOMException{}
.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/layer/Image getData() should detect pixels in the layer extent FAILED
        Error: expected null to be an instance of Uint8ClampedArray
            at Assertion.assert (D:/projects/my/working/dir/openlayers/node_modules/expect.js/index.js:96:13)
            at Assertion.a.Assertion.an (D:/projects/my/working/dir/openlayers/node_modules/expect.js/index.js:279:12)
            at Assertion.<computed>.a (D:/projects/my/working/dir/openlayers/node_modules/expect.js/index.js:499:17)
            at Context.<anonymous> (C:/Users/laundmo/AppData/Local/Temp/_karma_webpack_773544/webpack:/ol/test/browser/spec/ol/layer/Image.test.js:66:1)
.........
ERROR: DOMException{}
.
ERROR: DOMException{}
ERROR: DOMException{}
ERROR: DOMException{}
ERROR: DOMException{}
.......
ERROR: DOMException{}
ERROR: DOMException{}
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer #getData "before each" hook for "properly detects pixels" FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
...
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer Image rendering "before each" hook for "dispatches prerender and postrender events on the image layer" FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer renderFrame does not render if layer extent does not intersect view extent FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer renderFrame renders if layer extent partially intersects view extent FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer renderFrame renders without clipping when layer extent covers view FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/renderer/canvas/ImageLayer renderFrame resets image when empty FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
.......
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/source/ImageStatic #getImage scales image height to fit imageExtent FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/source/ImageStatic #getImage scales image width to fit imageExtent FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/source/ImageStatic #getImage Had an imageSize option which changed the imageExtent when used with incorrect image sizes FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.
ERROR: DOMException{}
Chrome Headless 137.0.0.0 (Windows 10) ol/source/ImageStatic #getImage triggers image load events FAILED
        Error: Timeout of 2500ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.

github-actions · 2025-06-20T23:41:05Z

📦 Preview the website for this branch here: https://deploy-preview-16923--ol-site.netlify.app/.

ahocevar

Thanks for your contribution, @laundmo. I triggered the CI tests, so you can see the test results - several tests are failing.

I don't know why the tests don't run for you. Did npm install run without any issues? Does npm run karma work? Maybe your Windows installation is locked down so some browser features are blocked?

Simplifying examples is ok, but changing their behavior and thus making them more complex is not so good. A dedicated new example that shows the new features of the Select interaction would be better.

ahocevar · 2025-06-20T23:44:46Z

+*.js text eol=lf
+*.cjs text eol=lf
+*.ts text eol=lf
+*.mjs text eol=lf


Please add these settings to your local git config, not to the repository.

well, its the repos prettier config which causes it to error on every single line with the default git settings on windows (convert LF to CRLF on pull, and back to LF on push)

i can definitely remove it, but i'd urge you to consider changing something so the default behaviour on windows when using your recommended development setup isn't errors on every single line

A note in DEVELOPING.md, describing how to configure git locally, would be the preferred alternative. Because that's missing in our recommended development setup.

aight, if thats what you want, i'll remove the commit. its not ideal though as this is not something which should be configured globally. And you can't configure it locally before cloning, so you'll have to:

clone

configure

git rm everything

git reset --hard

to fix the line endings. which is quite an annoyingly convoluted process for something like line endings which usually just works (as most projects don't care about having CRLF during development)

I spent quite some time in the past trying to make Prettier accept that, but failed. If you find a way, that's ok for me too.

You may also want to weigh in on #16597. As I said there, I'm not opposed to that change, so maybe it's time to merge that and you can rebase this pull request and get what you envisioned.

laundmo · 2025-06-21T00:07:07Z

I don't know why the tests don't run for you. Did npm install run without any issues?

Yup, no issues there

Does npm run karma work?

haven't tried that, what i've tried is the code-only tests, which worked fine.

Maybe your Windows installation is locked down so some browser features are blocked?

Not to my knowledge. Its not joined to a Domain, theres no group policies, its a relatively standard windows install.

but changing their behavior and thus making them more complex is not so good.

do you just mean the fact i added a filter to the box select example, the fact i swapped it over to using the new methods at all, or something else? please be specific, that way i know exactly what you have an issue with.

ahocevar

Regarding the examples, you convinced me. Now please focus on making the tests pass. The hints in the CI output should help, even if you're not able to run the tests locally, for whatever reason.

ahocevar · 2025-06-22T09:33:29Z

+*.js text eol=lf
+*.cjs text eol=lf
+*.ts text eol=lf
+*.mjs text eol=lf


A note in DEVELOPING.md, describing how to configure git locally, would be the preferred alternative. Because that's missing in our recommended development setup.

laundmo · 2025-06-24T11:10:30Z

I think i found why browser test are failing: karma-runner/karma#251

seems Karma doesn't handle absolute paths on Windows at all, since 2012? I am seeing the same kind of URL error from that issue in some stacktraces: http://localhost:9876/absoluteC:/Users/laundmo/AppData/Local/Temp/_karma_webpack_367715/webpack:/ol/node_modules/geotiff/dist-module/geotiff.js:548:1

edit: nope, doesn't seem likely, as the js modules seem to load fine, its the assets/data (images etc) which are failing

laundmo · 2025-06-24T13:06:02Z

Okay i finally found out the main issue with tests: It seems that by default, Windows resolves localhost to IPv6 by default, while Karma currently runs in IPv4-only by default.

This means only the proxied paths, where the karma server was making a request to itself after rewriting the URL, it tried to request for example http://localhost:9876/base/spec/ol/data/dot.png which got resolved to http://[::1]:9876/base/spec/ol/data/dot.png, and since Karma doesn't listen to ipv6 by default that caused a ECONNREFUSED error.

Turns out, one fix for this is explicitly setting the hostname to the IPv4 127.0.0.1 instead of the localhost hostname.

laundmo · 2025-06-24T16:14:21Z

tests should be fixed now, and i added tests for the new methods

ahocevar

Thanks, @laundmo

laundmo · 2025-07-04T14:21:50Z

Oh, you merged the .gitattributes stuff too, nice. i was wondering when i'd have time to remove that commit...

thanks for merging!

laundmo added 3 commits June 20, 2025 22:40

fix git using auto-crlf on windows causing prettier to error "remove …

2c46e0b

…CR" on every line

Add methods to Select interaction to select features as if they were …

dc23c9c

…clicked (applying filters, select events)

update and migrate select examples to using the Select interaction an…

8c2c353

…d its features

laundmo closed this Jun 20, 2025

laundmo reopened this Jun 20, 2025

ahocevar changed the title ~~Implement #16918 - Select methods for adding/removing features~~ Select methods for adding/removing features Jun 20, 2025

ahocevar reviewed Jun 20, 2025

View reviewed changes

ahocevar reviewed Jun 22, 2025

View reviewed changes

laundmo added 3 commits June 24, 2025 15:16

fix tests on windows by settings hostname to explicitly ipv4 localhost

9623cd7

small refactor and fixes for tests

69a322f

add new tests for newly added features

03111f3

ahocevar marked this pull request as ready for review July 4, 2025 14:01

ahocevar approved these changes Jul 4, 2025

View reviewed changes

ahocevar merged commit ebaa191 into openlayers:main Jul 4, 2025
8 checks passed

This was referenced Jan 23, 2026

Select Interaction features collection events in wrong order #17297

Closed

Fix order of Select interaction's feature collection events #17301

Merged

Uh oh!

Uh oh!

Conversation

laundmo commented Jun 20, 2025 • edited by ahocevar Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

laundmo commented Jun 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jun 20, 2025

Uh oh!

ahocevar left a comment

Choose a reason for hiding this comment

Uh oh!

ahocevar Jun 20, 2025

Choose a reason for hiding this comment

Uh oh!

laundmo Jun 21, 2025

Choose a reason for hiding this comment

Uh oh!

ahocevar Jun 22, 2025

Choose a reason for hiding this comment

Uh oh!

laundmo Jun 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

ahocevar Jun 22, 2025

Choose a reason for hiding this comment

Uh oh!

ahocevar Jun 22, 2025

Choose a reason for hiding this comment

Uh oh!

laundmo commented Jun 21, 2025

Uh oh!

ahocevar left a comment

Choose a reason for hiding this comment

Uh oh!

ahocevar Jun 22, 2025

Choose a reason for hiding this comment

Uh oh!

laundmo commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

laundmo commented Jun 24, 2025

Uh oh!

laundmo commented Jun 24, 2025

Uh oh!

ahocevar left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

laundmo commented Jul 4, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

laundmo commented Jun 20, 2025 •

edited by ahocevar

Loading

laundmo commented Jun 20, 2025 •

edited

Loading

laundmo Jun 22, 2025 •

edited

Loading

laundmo commented Jun 24, 2025 •

edited

Loading