Select event does not fire when using shift to select multiple areas

[d3lm]

Select event does not fire when using shift to select multiple areas

[toddhd]

That appears to have worked! Thank you!

[toddhd]

Thank you for the quick reply and investigation by the way, I can't believe you answered so quickly! :)

[d3lm]

Hey @toddhd, this is actually the expected behavior. The shift key is basically a "temporary add" so the items you select when holding down shift will only be selected when you release the mouse button. The same goes for Shift + CTRL for temporarily removing items. Same here, the items are only removed when you release the mouse button.

But, I am figuring that even when the mouse button is released the items are not selected. There is something off. Maybe I have broken something with the last fix or deployment. Does that work for you?

[d3lm]

So I have tested this on Mac as well, and there it seems to work... I am investigating what the differences are.

[toddhd]

What I expected was one of two situations. Either onSelect() would fire each time you lift your finger off the mouse button (as you described) or that it would fire once you released the SHIFT key (which is what I expected, as that would indicate that all of your selections are done). Either would work for my needs.

I am creating a schedule component that allows the user to drag across a "calendar" of sorts. Unfortunately, it does not work for me as I have no idea what is selected unless the event passes me the items. (For some reason, my "selectedItems" never seems to actually contain my selected items as it should, so I've been grabbing the selected items by hand from onSelect() and processing them from there.

[d3lm]

Hehe, I am definitely dedicated to fix incoming issues. And this seems to be a big one... I am wondering why this works on Mac but not on a Windows. Which OS are you using? It also doesn't seem to be related to the browser, cause Firefox on Mac works as expected... super strange.

[toddhd]

I am working on Windows 10 Pro 64bit. Chrome is my main browser but I am testing in FireFox at the moment. Everything (OS, browsers) is up to date. Appreciate the help.

[d3lm]

Ok, good to know. Very interesting. This is really hard to reproduce and to verify for me on a Mac. Cause it works as expected... I also have a Windows but that's not my dev machine. There it's broken.

[d3lm]

This is how it works on Mac, and this is also how it's supposed to be working.

Still trying to figure out how I can reproduce this on my dev machine...

[toddhd]

Do you happen to have Firefox or Chrome on OSX? Does it work in those browsers in OSX?

What are you using for the selection capability? Are you using Angular's built-in select, or custom code? Maybe the problem is in their logic, if it is a third-party selection routine...

[d3lm]

So I am mainly using Chrome but I have also tested the app (latest version) in Firefox and Safari. All browsers seem to work on my machine.

Everything is basically custom code for selecting those items 🤔

[toddhd]

Very strange. You would think that FF and Chrome would work basically the same regardless of OS on a PC. Maybe it's a keyup/keydown issue?

[d3lm]

Yea I would assume that the browsers work the same regardless of the OS. So it must be something regarding the OS I assume...

[d3lm]

So if you roll back to 2.1.0 it should work again but there are a couple of bug fixes missing and also some minor features. But maybe that works for you in the meantime.

Can you verify that this version works for you?

Also, if it worked in 2.1.0 there must be something that broke the functionality on Windows. Tricky to debug now haha.

[toddhd]

Thank you, I'll give that shot.

[toddhd]

That seems to be working for now, just a quick smoke test. (Of course, like a dumb-ass, I had modified the CSS and forgot, and blew it away when I rolled back). I'll let you know when I get it put back together.

If I get a chance later, I'll see if I can get the source code and take a look on my machine. I'm not sure if you have a custom environment setup, but it's worth a shot.

Thanks again for the support!

[d3lm]

No not really a custom setup. You can just clone the repo and install the dependencies. I am doing the same as we speak on my Windows machine to see what's going on. I'll keep you posted.

[d3lm]

BTW thank you very much for opening this issue. This is really a blocker as it doesn't work properly on Windows anymore.

[d3lm]

So, I dug into this issue and I was able to pin point this to the keyboard events that apparently behave differently on Windows / Mac. This means that when you press a key and hold it pressed on Mac, the event is fired only once. On Windows this causes the event to be fired repeatedly. This was a problem because for every keyboard event, the temporary list of items (built up in any of the extended selection modes) is cleared. This was causing the items from not being deselected once you start pressing any key, cause there are basically no items to be deselected in the cache... it was already cleared but not flushed.

With the fix that I just pushed, keyboard events should behave consistently and the issue should be fixed. I have also released v3.0.3 on npm which should be now available.

So for now, I am closing this issue because I can no longer reproduce the issue on any platform.

I would appreciate it if you could verify that the fix works on your end too.

Happy testing!

[d3lm]

Uhm ok, Travis is not happy and cannot deploy the new version. I am on it!

[d3lm]

Ok, v3.0.3 is now available on npm. Give it a try!