The date error from day.js in Firefox is not valid

My date is formatted as 2022-01-27 09:23:48 UTC and I am trying to parse it into MMMM-DD-YYYY format (Jan-27-2022) using day.js. The parsing works well in Chrome, but Firefox returns an 'Invalid' result.

import dayjs from "dayjs"

const utcDate = '2022-01-27 09:23:48 UTC'
const formatedDate = dayjs(utcDate).format("MMMM-DD-YYYY")

I have attempted to use the customParseFormat function mentioned in the documentation and other resources

import dayjs from "dayjs"
import customParseFormat from 'dayjs/plugin/customParseFormat'
dayjs.extend(customParseFormat)

const utcDate = '2022-01-27 09:23:48 UTC'
const formatedDate = dayjs(utcDate, 'MMMM-DD-YYYY')

In both instances, Firefox and Safari return an 'Invalid Date', while Chrome functions correctly. Is there a solution for this issue?

Answer №1

The problem has been fixed thanks to @pilchard

import moment from "moment"

const utcDateTime = '2022-01-27 09:23:48 UTC'
const formattedDateTime = moment(utcDateTime.slice(0, -4)).format("MMMM-DD-YYYY")

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Updating the id token in VueJs using Axios interceptor when it expires

I need to implement an axios interceptor that will add the idToken as an authorization header to every axios call, and also refresh the idToken if it has expired before making any call. My current code for this task is as follows: axios.interceptors.requ ...

Error: The function 'stepUp' was invoked on an object lacking the HTMLInputElement interface during an AJAX request

It's always frustrating to have to ask a question that has already been asked, but I'm having trouble finding a solution that works for me. My issue involves retrieving the value of an input and sending it via AJAX. $("#cell_number").on("change" ...

Ways to ensure that a function operates independently for each cloned div and not the original

I'm facing an issue where a jquery function needs to be executed when the drop-down is changed. However, the problem arises when I clone the div element and make changes in the drop-down of the newly cloned element, the effect takes place in the first ...

The replace method for strings in JavaScript does not function properly on mobile devices

I encountered an issue with the string replace method I implemented on my website. Upon checking the page using the web browser on my Android phone, I noticed that it was not functioning as intended. Here's a snippet of the code: /*The function is ...

Tips for sending parameters using arrow functions within ReactJS hooks

I've recently started working with ReactJS and I'm a bit confused about how to pass parameters using arrow functions. I attempted to use .bind() in order to bind the value so it can be used in the function, but unfortunately that didn't work ...

Socket.io is most effective when reconnecting

I am currently in the process of developing a React application that connects to a Node.js API and I am trying to integrate the Socket.io library. Following various online tutorials, my code now looks like this: API: import express from 'express&apo ...

Utilizing the body in GET requests for enhanced client-server communication

What makes url query strings better than request body values? There are distinct advantages to using url parameters, such as visibility in the address bar and the ability to save requests in the browser history. However, is there more to it? Could reques ...

Adjusting the prototype of a JavaScript object in real-time

Is there a way to dynamically change object prototype in JavaScript in order to fully recover an object previously saved using JSON, including its behavior? Currently, one solution is to create a new object and copy the data from the JSON-recovered object ...

Encountering a problem where PDF is displaying squares instead of text while using ReactDOM.createPortal to

Currently, I'm working on a React application where I am using createPortal in ReactDOM to open certain components in new windows. Everything seems to be functioning correctly, except when I try to render PDF files. Strangely, everything works fine wh ...

Update the information for every ride to include an appropriate park_id instead of the `park_name` property

I created a function that takes an array of objects and modifies one of the object's names to its corresponding property id. Here is the function implementation: function prepareRidesData(rides, parks) { if (!rides.length) return []; const parksL ...

Discover the CSS auto height value using JavaScript

Is there a way to utilize JavaScript in determining the value set for auto height in CSS? My development stack includes Grails and jQuery. For instance, consider the following CSS: .tool-preview { height: auto; } ...

How can you effectively transfer a parameter from .run to .config?

Currently, I am working on my angularjs ui-route project and have placed a variable called clientid in the .run() core function to store it in $rootScope. However, there comes a point where I need to access this stored variable within the .config() core. ...

Is it possible for users to circumvent limitations on specific routes or pages in a Vue.js application by exploiting the fact that all the code is processed on the client

When developing a single page application utilizing technologies like Firebase, do API keys remain hidden from users since all code is executed on the client side? Additionally, given that users are limited to specific routes or pages based on conditions ...

Issue arose when attempting to utilize the API key as an environmental variable within the Butter CMS library while working within the async

After migrating my website from Drupal to Vue, I decided to enhance the SEO performance by transitioning it to Nuxt. However, I am encountering difficulties in setting and utilizing a private API key as an environment variable in a component with the Butte ...

When a user clicks on a child element in ReactJS, the onclick event returns as undefined

I am experiencing an issue with my restaurants list component. While I have an onClick event set up for each list item, clicking on a child element of the list item does not trigger the expected response. When this occurs, nothing happens or I see an undef ...

I encountered an error in the console stating, "Uncaught ReferenceError: req is not defined," while trying to access req.query.id

Encountering the error 'Uncaught ReferenceError: req is not defined' when attempting to use req.query.id. Below is the content of my index.js file: const express = require("express"); const path = require("path"); const port = 8000; ...

Using the "Keys.ESCAPE" function in Selenium WebDriver with Python allows for easily

Currently, I am utilizing selenium webdriver (with python). There is a scenario where I need to verify that the submit button becomes disabled once the form is submitted. In order to test this functionality, I attempt to halt the loading of the next page b ...

React encountered an abrupt end of JSON input unexpectedly

As I embark on my coding journey, I am delving into the world of React. However, as I try to create a new app, I encounter an error message stating "unexpected end of JSON input." While installing packages and waiting patiently, the console throws an err ...

Issues with importing Three.js as a module - encountering an Uncaught SyntaxError:

I am currently delving into the world of three.js and working on my first project. I am following the example code provided on the three.js website. Everything runs smoothly when I have three.js stored in a folder like: js/ directory However, I am enco ...

Problem with jQuery's UI autocomplete functionality

Implementing jQ UI Autocomplete with multiple values Below is how my function is structured: mailto_input.bind( "keydown", function( event ) { if ( event.keyCode === $.ui.keyCode.TAB && $( this ).data( "autocomplete" ).menu.active ) { ...