iamkun / dayjs

⏰ Day.js 2kB immutable date-time library alternative to Moment.js with the same modern API
https://day.js.org
MIT License
47k stars 2.3k forks source link

startOf('month') gives last day in previous month #2007

Open sts-ryan-holton opened 2 years ago

sts-ryan-holton commented 2 years ago

Describe the bug

Start of month is incorrect and showing the last day in previous month.

const from = dayjs.tz(dayjs(),'Europe/London').startOf('month')
const end = dayjs.tz(dayjs(),'Europe/London').endOf('month')

The above when console logged outputs:

from: Thu, 30 Jun 2022 23:00:00 GMT to: Sun, 31 Jul 2022 22:59:59 GMT

Which I think we can all agree is incorrect

Expected behavior

start of time should always return correct times.

Information

Bykiev commented 2 years ago

Hi, this is a correct result, moment.js has the same result. Here is a small demo

sts-ryan-holton commented 2 years ago

@Bykiev cool, except the start of the month isn't June 30th when dayjs() alone returns the current day. So how do I resolve this?

Bykiev commented 2 years ago

GMT is an UTC time, London has an UTC offset +0100

sts-ryan-holton commented 2 years ago

@Bykiev, Okay, but, in Europe > London right now the start of the month according to my calendar isn't June 30th 🤣, how do I resolve this issue?

Bykiev commented 2 years ago

If you'll use date() function it'll return date of month in a local time. Here is a demo

BePo65 commented 2 years ago

I created a simple webpage to test the function:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>dayjs issue #2007</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/dayjs@1.11.4/dayjs.min.js"></script>
    <script src="https://unpkg.com/dayjs@1.11.4/plugin/utc.js"></script>
    <script src="https://unpkg.com/dayjs@1.11.4/plugin/timezone.js"></script>
  </head>
  <body>
    <style type="text/css">
    body {font: 12px/14px sans-serif}
    .tg  {border-collapse:collapse;border-spacing:0;}
    .tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
      overflow:hidden;padding:10px 5px;word-break:normal;}
    .tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
      font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
    .tg .tg-0pky{border-color:inherit;text-align:left;vertical-align:top}
    </style>
    <main>
      <h1>dayjs issue #2007</h1>
      <table class="tg">
      <tbody>
        <tr>
          <td class="tg-0pky">dayjs().tz('Europe/London').format()</td>
          <td id="dayjs-value" class="tg-0pky"></td>
        </tr>
        <tr>
          <td class="tg-0pky">dayjs.tz(dayjs(),'Europe/London').startOf('month').format()</td>
          <td id="dayjs-start-of-month" class="tg-0pky"></td>
        </tr>
        <tr>
          <td class="tg-0pky">dayjs.tz(dayjs(),'Europe/London').endOf('month').format()</td>
          <td id="dayjs-end-of-month" class="tg-0pky"></td>
        </tr>
      </tbody>
      </table>
    </main>
    <script>
      dayjs.extend(window.dayjs_plugin_utc);
      dayjs.extend(window.dayjs_plugin_timezone);

      const now = dayjs().tz('Europe/London')
      const startOfMonth = dayjs.tz(now,'Europe/London').startOf('month');
      const EndOfMonth = dayjs.tz(now,'Europe/London').endOf('month');
      document.getElementById('dayjs-value').textContent = now.format();
      document.getElementById('dayjs-start-of-month').textContent = startOfMonth.format();
      document.getElementById('dayjs-end-of-month').textContent = EndOfMonth.format();
    </script>
  </body>
</html>

The result is: TestResult1

So I cannot reproduce this error neither on Chrome 103 nor in Firefox 103 on my windows 10 machine. Could you try this code on your system?

koluch commented 1 year ago

Hey @Bykiev @BePo65, it feels like I am also facing this bug. I am trying to work in 'Etc/UTC', setting specific date and using .date() function to get a date, but it still returns 31 instead of 1:

image

Here is a code to reproduce: https://codesandbox.io/s/dayjs-playground-forked-sdy6hk?file=/src/index.js. I am using 1.11.8 version

Kretiss commented 2 months ago

Facing same issue