October: Backend lists displaying incorrect dates

[Cellular-]

Expected behavior

When viewing a backend list created with Builder, I should be able to see the dates of the record.

Actual behavior

When viewing a backend list created with Builder, the dates are being displayed 1 day old. For example, if I submit a record with date 9/4/16, the backend list will show 9/3/16. The table will show the correct date of 9/4/16 though.

Reproduce steps

Use a backend form to submit a record to your plugins table. Then view the record in the plugins backend list.

October build

363

[daftspunk]

This is most likely caused by the app.timezone setting (defaults to UTC) used for storing the date in the database, which is then converted by the cms.backendTimezone setting, which can also be modified in the Backend preferences screen.

Please confirm what your app.timezone is set to and what your backend preferences timezone is set to.

[Cellular-]

App timezone set to UTC. Backend timezone set to UTC -6. I went to the backend list for my plugin and inspected DOM after adding a new record to my list and I get this:

"Deprecation warning: moment construction falls back to js Date. This is discouraged and will be removed in upcoming major release. Please refer to https://github.com/moment/moment/issues/1407 for more info.
Arguments: [object Object]
Error"

There are other errors, but it contains links to my internal application so I do not want to make that public. I can PM you the other errors with storm.min.js

[daftspunk]

Are you able to replicate this using the test plugin?

[daftspunk]

As per the contribution guidelines, please provide the exact steps you are taking for the issue to occur. This will be used for peer review.

[ekrokowski]

I also experienced this behaviour.

• app.timezone was "UTC"
• backend prefs were "UTC-11"

Setting both timezones to "UTC" fixed the problem.

[meysammahfouzi]

@ekrokowski @daftspunk

TL;DR
Setting both timezones to UTC is a bad practice. The correct approach to fix this problem is setting ignoreTimezone: true for date fields.

Details:
I had the same problem. The timezone in my app.php file is set to 'UTC' and the timezone in my backend preferences is set to (UTC +4:30). This works perfectly when working with DateTime fields. So if I enter a DateTime like 7/11/2019 11:55 in the backend form and save the model, the DateTime saved into the database will be 2019-07-11 07:25:00 which is in UTC format and is correct. But the date field is saved as "2019-07-10". Why? Where does this one day difference come from?

For form fields which are of type 'date' we have to be careful! When we set a date field to something like 7/11/2019 (11 July 2019), October tries to convert it to the timezone of backend before saving it, so because the timezone of application is UTC +4:30 and the backend timezone is UTC 00:00, October will first convert 7/11/2019 00:00 to 7/10/2019 19:30 and will save it in a date field in database. Therefore it will be saved as 7/10/2019. Now when October wants to display this date in the backend, it first tries to convert the date from UTC to UTC +4:30 before displaying it. So it grabs 7/10/2019 from database, considers it as "7/11/2019 00:00", converts it to "7/10/2019 04:30" and therefore displays it on the backend as 7/10/2019! The solution for this problem is to tell October ignore timezone for date fields:

https://github.com/octobercms/october/issues/3392
https://octobercms.com/docs/backend/forms#widget-datepicker
https://octobercms.com/docs/backend/lists#column-datetime

ignoreTimezone display datetime exactly as it is stored, ignoring October's and the backend user's specified timezones

This is exactly what I did for the date field in one of my plugins:

    created_at:
        label: 'Event Date Time'
        mode: datetime
        span: auto
        required: 1
        type: datepicker
    date:
        label: Date
        span: auto
        mode: date
        required: 1
        defaultFrom: created_at
        dependsOn:
            - created_at
        type: datepicker
    ignoreTimezone: true

[LukeTowers]

@meysammahfouzi can you make a PR to the docs to make this more clear that if you are using mode: date you probably want to be using ignoreTimezone: true?

[meysammahfouzi]

@LukeTowers Yes, I hope this helps: https://github.com/octobercms/docs/pull/385
I was wondering if there is any documentation for setting timezone in October at all?

[LukeTowers]

@meysammahfouzi in what way? What specifically are you looking for?

[meysammahfouzi]

@LukeTowers There are two places in October where timezone can be set. One in the app.php file and another in the backend preferences. Has the usage of each of them and the difference between them been documented anywhere? I think this could be confusing for the new users.

[LukeTowers]

@meysammahfouzi there's a note in the configuration about it: https://github.com/octobercms/october/blob/master/config/app.php#L56. Also, there's technically three: app.timezone, cms.backendTimezone, and the user's backend preferences.