format not working

[ralyodio]

dateFns.format(new Date("2021-02-09T06:55:49.863"), 'PPPP');

doing this in browser just returns "PPPP"

[laduke]

I'm seeing something similar.
In the browser:
format(new Date(2014, 1, 11), 'MM/dd/yyyy') -> 02/Th/yyyy
In node, in the same project, same package.json:
it gives the expected result (02/11/2014)

Same thing with 'PPPP'

Can anyone guess what's happening?

[fturmel]

@chovy @laduke

Both your examples seem fine to me: https://codesandbox.io/s/xenodochial-sammet-4tni4?file=/src/index.js

Could you share more details about your setup, which version of date-fns you are using, how you are importing the format method in your code, bundlers, etc? Are you able to fork and change my example to recreate your issues?

[laduke]

Thanks for writing. It's an older React app that's getting bundled with browserify. I noticed on date-fns 2.15.0, but I also tried 2.22.1

I was eventually just testing like:

const format = require('date-fns/format')
console.log(format(new Date(2014, 1, 11), 'MM/dd/yyyy'))

I've punted and just used some javascript standard library date functions to get what I wanted.

It's probably going to be really hard to reproduce and fix. Was hoping someone would just know what the issue is from seeing it before. Maybe something weird is happening with the babelify transform.

I give up on fixing it for myself for now. :)

[fturmel]

Actually, I think I figured it out. I think you might be using date-fns v1 inadvertently in your project (maybe through a phantom dependency?).

If you go in my codesandbox example and change the date-fns version to 1.30.1 you'll see exactly the outputs you are both receiving.

The supported tokens for the format and parse methods have changed in v2. PPPP, yyyy are not understood by v1 so they remain unchanged, while dd has a different meaning in both versions.

You can see the token tables in both versions here:
https://date-fns.org/v2.22.1/docs/format
https://date-fns.org/v1.30.1/docs/format

[laduke]

Maybe!

npm ls date-fns
├─┬ cypress@7.4.0
│ ├─┬ @cypress/listr-verbose-renderer@0.4.1
│ │ └── date-fns@1.30.1 
│ └─┬ listr@0.14.3
│   └─┬ listr-verbose-renderer@0.5.0
│     └── date-fns@1.30.1 
├── date-fns@2.15.0 
└─┬ lint-staged@4.3.0
  └─┬ listr@0.12.0
    └─┬ listr-verbose-renderer@0.4.1
      └── date-fns@1.30.1