The time set for an event in the CMS is 4 hours ahead of the time shown on the page

[rodneybarnes]

Expected Behavior

When a user inputs a time for an event in the CMS, that same time should show on the event post in production.

Current Behavior

The time shown on the published event post is 4 hours ahead of the time input by the user.

Possible Solution

Steps to Reproduce

1. Log in to the CMS (currrently only available to admins).
2. Click on the 'Events' collection.
3. Click on 'New Events' to add a new event.
4. Fill out the form field. In the 'When' field, select a date and time.
5. Click 'Save' to save the post.
6. Click 'Set Status' > 'Ready' to prepare the post for publishing.
7. Click 'Publish' to publish the post.
8. Wait for the build to redeploy.
9. Once the build has been deployed, observe that the time on the event post is 4 hours ahead of the time set in the CMS.

Context (Environment)

Detailed Description

The issue seems to be with NetlifyCMS. It takes the date the user enters into the new post and converts it to UTC.

Possible Implementation

[rodneybarnes]

I've done a bit of digging and tinkering around on this one, but haven't had a chance to actually fix it yet. Here's a description of what I've tried so far:

I thought maybe changing the dateFormat or timeFormat fields in the config.yml file might prevent this behaviour, but it only allows you to change the format that is returned, not the format that is saved.

It's possible that adding an explicit format option to the 'When' field might force the cms to save the time using the local time zone, but it is currently difficult to test this without potentially bringing down the website - if we change the format to correspond with the query ("format: "h:mma dddd, MMMM Do YYYY"") and create a new event post, it might break the event roll query that filters events based on date, as that filter is expecting a Date object and will throw an error if it finds a string (which is what I suspect declaring an explicit format will change the type to - currently, not setting the format has the field return a raw Date object).

In order to test this, we would need to set up NetlifyCMS to work on localhost, which is something that should be done anyways.

Another option we have is to take the raw date object returned by the query and use moment to convert it back to the local time zone. This might be the most feasible, currently.

Relevant links:
https://www.netlifycms.org/docs/widgets/#datetime
https://stackoverflow.com/questions/55550029/date-widget-input-appears-to-save-inconsistent-to-display
decaporg/decap-cms#1307