rux-track and rux-time-region appear off the end of the track

[ascala07]

Describe the bug The rux-track and rux-time-region extend past the end of the other tracks in certain situations. This seems to occur when the last time region on the track starts and ends around the last day of the timeline.

To Reproduce

<div style="margin: auto; margin-top: 84px;">
    <rux-timeline timezone="America/New_York" start="2021-02-01T00:00:00.000Z" end="2021-02-03T00:00:00.000Z" playhead="2021-02-01T04:00:00.000Z" interval="day" zoom="2">
        <rux-track>
            <div slot="label">Region 1</div>
            <rux-time-region start="2021-02-01T01:00:00Z" end="2021-02-01T02:00:00Z" status="serious">Event 1.2</rux-time-region>
        </rux-track>
        <rux-track>
            <div slot="label">Region 2</div>
            <rux-time-region start="2021-02-00T0:00:00Z" end="2021-02-03T12:00:00Z" status="serious">Event 2.1</rux-time-region>
        </rux-track>
      <rux-track>
            <div slot="label">Region 2</div>
            <rux-time-region start="2021-02-02T10:00:00Z" end="2021-02-01T12:00:00Z" status="serious">Event 2.1</rux-time-region>
        </rux-track>
        <rux-track slot="ruler">
            <rux-ruler></rux-ruler>
        </rux-track>
    </rux-timeline>
</div>

Current behavior The rux-track and rux-time-region extend past the end of the other tracks in certain situations.

Expected behavior The track should start at the correct day and be cut off with the appropriate dotted line.

Screenshots

CodeSandbox I was able to produce this in a code sandbox but I am having trouble sharing, please use the HTML above.

• Browser: Edge
• @astrouxds/astro-web-components version 7.19.0
• Framework: Angular
• Framework wrapper: @astrouxds/angular 7.19.0

Additional context Add any other context about the problem here.

[micahjones13]

Hey @ascala07, thanks for bringing this up!

I've copied your code in a sandbox and noticed that the start time on the track that's giving you issues is in an incorrect format. I changed it from 2021-02-00T0:00:00Z to 2021-02-01T00:00:00Z and see the track working alright now. I did see the issue you mentioned though when changing the time to 2021-02-01T0:00:00Z (a correct day but incorrect hour), so I'm hoping that fixing this typo will solve your issue.

Please let me know if this solves it, or if I need to dig deeper!

[ascala07]

Hi Micah,

Sorry about that, should have been more careful when I was hand typing those values in. I was still able to replicate it with this

<div style="margin: auto; margin-top: 84px;">
    <rux-timeline timezone="America/New_York" start="2023-11-01T00:00:00.000Z" end="2023-11-18T00:00:00.000Z" interval="day" zoom="2">
        <rux-track>
            <div slot="label">Region 1</div>
            <rux-time-region start="2023-11-02T00:00:00.000Z" end="2023-11-06T00:00:00.000Z" status="serious">Event 1.2</rux-time-region>
        </rux-track>
        <rux-track>
            <div slot="label">Region 2</div>
            <rux-time-region start="2023-11-17T00:00:00.000Z" end="2023-11-17T03:00:00.000Z" status="serious">Event 2.1</rux-time-region>
        </rux-track>
        <rux-track>
            <div slot="label">Region 3</div>
            <rux-time-region start="2023-11-02T00:00:00.000Z" end="2023-11-06T00:00:00.000Z" status="serious">Event 1.2</rux-time-region>
        </rux-track>
        <rux-track slot="ruler">
            <rux-ruler></rux-ruler>
        </rux-track>
    </rux-timeline>
</div>

Hopefully I did not make any mistakes this time.

[micahjones13]

Hey @ascala07, this was indeed a daylight savings time bug. We've fixed it with the above PR and it'll be included in a patch release today (7.19.1). This release should be live in a few hours. Thanks again for bringing this up!

[ascala07]

Hey @ascala07, this was indeed a daylight savings time bug. We've fixed it with the above PR and it'll be included in a patch release today (7.19.1). This release should be live in a few hours. Thanks again for bringing this up!

Thank you so much for the quick turn around!