[Panel] Changing a date in Edge does not bring up save bar

[fabianmichael]

Describe the bug
When changing the value of a date field using Microsoft Edge, the save bar is not displayed.

To Reproduce
Steps to reproduce the behavior:

1. Install the starterkit and open the edit view for any page with a date field.
2. Change the day/year etc. in the date field.
3. No save bar appears. However, it is displayed, once you edit any other field of the page.

Expected behavior
The save bar should be displayed, as with any other changed value.

Kirby Version
3.1.3

Console output
none

Desktop (please complete the following information):

• OS: Windows 10 (Windows Update says, it’s the latest version)
• Browser: Microsoft EdgeHTML 17.17134 (This number also appears above the version without any further description what it means: 42.17134.1.0)

[distantnative]

@lukasbestle @bastianallgeier am I right that this issue has not been tackled cause no one of us has a windows pc with edge at hands to test and debug? How dill we deal with that situation?

[lukasbestle]

I haven't tackled it since I'm not working on the Panel. ;)
I'd have a Windows 10 VM though (https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/).

[afbora]

I tried to find the source of the problem and found the issue:

I noticed it didn't work even though I put a breakpoint to @input event.
So not triggerring @input event in select with date field type.
But works with selecting date from calendar.
Then i confirmed with adding standalone select field type and didnt work too as you can see in screencast.

Console: No any errors.

So i searched in google and i found out why it doesn't work:

https://stackoverflow.com/a/54516876/1769465

Versions

• Kirby 3.2.3-RC.1
• Windows 10
• Microsoft Edge 44.17763.1.0
• Microsoft EdgeHTML 18.17763

[distantnative]

You are a hero, thanks for tracking this down!

[afbora]

You're wellcome 😅

After this stage there is something you want me to test, I can gladly do.

[distantnative]

@afbora and @lukasbestle:
Could one of you test it with these dist files. Just replace the panel/dist/ directory and make sure to remove the media/panel/ folder. I hope this small change will fix it:

dist.zip

[afbora]

I have tested now and nothing happened for me on fresh install, still same :((

[distantnative]

Hmm... I followed exactly vuejs/vue#7248 – not sure why this would not work then.

[afbora]

Has it worked successfully on a platform like jsbin/jsfiddle?

[distantnative]

I wouldn't know how to test the Panel over there.

[afbora]

https://jsbin.com/zicevezani/edit?html,js,output

I guess this sample works with Edge browser.
When I click it prints the selected one.

[distantnative]

That's how we have had it so far in Kirby – so no idea why this is working for you in the example but not in the Panel.

[afbora]

As you said, the event seems to be working on the dropdown element.

Can we create a copy of Kirby select field element on jsbin? I tried, but I failed.
If it is not difficult, maybe we can find the error more easily when creating this copy.

[distantnative]

@afbora I created one with the new implementation, could you give it a try: https://jsbin.com/zicumixara/edit?html,js,output

[afbora]

@distantnative Great! I have tested now. Chrome working with output. But no output (empty) in Edge with following console error:

Expected identifier, string or number (line 51)

[distantnative]

Hmm, ok this really won't work debugging just going back and forth since I have no clue so far where even that error is coming from. I am afraid I won't be able to continue working on this before getting my hands on Edge myself (in the macOS Edge beta it works fine).

[afbora]

You're right, it's hard to find a solution like this.

By the way, worked with output and change event when I tried to remove the ...this.$listeners line.

[distantnative]

One more try, @afbora: Does this work: https://jsfiddle.net/c98yt5de/5/?

[afbora]

Same with jsbin. No output and Expected identifier, string or number error that ...this.$listeners line.

When i remove that line, html and console output working with not errors 👍

[distantnative]

Actually, I have been so much focussing on the @input event that was mentioned in those links as not supported by Edge. But it seems more that the problem is the spread operator:

[distantnative]

I replaced the spread syntax with Object.assign:
https://jsfiddle.net/yj5od7tb/

I don't want to remove that line, it might break something else.

[afbora]

I don't want to remove that line, it might break something else.

Just to show you how it works.

Now perfectly works, tested with Edge, Chrome, Firefox 👍 👍 👍

[distantnative]

Hopefully (!) one last check:
Does it actually work now in the Panel as well with these dist/ files?
dist.zip

[afbora]

Working perfect with panel and no console error 👍

[distantnative]

🎉 thanks a lot!

[bastianallgeier]

✅