Skip to content

Type into datetime-local input: seconds not accepted #22884

@Zarmakuizz

Description

@Zarmakuizz

Current behavior

When typing into an input datetime-local field, the only datetime format tolerated by Cypress doesn't accept seconds. 2022-03-04T10:11 is accepted (yyyy-MM-ddThh:mm) but 2022-03-04T10:11:12 is declined.

Although the Cypress type page doesn't give any format for datetime-local, some Cypress runner warnings say that yyyy-MM-ddThh:mm is supported with optional :ss or :ss.SSS suffixes, which isn't the case.

In the example code, Cypress throws the following if we want to type a DateTime with seconds:

Typing into a datetime input with cy.type() requires a valid datetime with the format YYYY-MM-DDThh:mm, for example 2017-06-01T08:30. You passed: 2022-03-03T10:11:12

Desired behavior

When typing a datetime, Datetime formats should accept seconds.

Test code to reproduce

context('Datetime-Local picker', () => {
  it('insert a date with seconds', () => {
    cy.visit(
      'https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_datetime-local',
    );

    cy.get('#iframeResult', { timeout: 10000 })
      .its('0.contentDocument')
      .should('exist')
      .its('body')
      .should('not.be.undefined')
      .then((body) => {
        cy.wrap(body)
          .find('#birthdaytime')
          // Ensure that the DateTime input lets the user choose seconds
          .invoke('attr', 'value', '2022-01-02T01:02:03');
      });

    cy.get('#iframeResult', { timeout: 10000 })
      .its('0.contentDocument')
      .should('exist')
      .its('body')
      .should('not.be.undefined')
      .then((body) => {
        cy.wrap(body).find('#birthdaytime').clear().type('2022-03-03T10:11:12');
      });
  });
});

Cypress Version

9.7.0

Other

I did not try on Cypress 10.x.x because our company did not migrate to it yet.

The real project uses React and more dependencies, as such I cannot set the input field's value using invoke.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions