I would like to trigger nativ browser's calendar from js.

I have a page where users want to see dates on different formats (choosen between 30/03/2022, monday 12 mars 1911, etc etc ), but they have to be able to edit these dates. Actual solution would be to show a text[input=text], to convert it under the hood with a $input.prop('type', 'text') on click events; and to trigger a new click on the element. Well, it doesn't trigger the calendar.

<input data-type="date" type="text" >

<script>
$el = $('input[data-type=date]');

$el.on('click', (e, el) => {
  $el = $(el);

  $input.prop('type', 'date');
  // convert format from required one to 06-06-2066
  $input.trigger('click');
});

$el.on('blur', (e, el) => {
  $el = $(el);

  // convert format from 06-06-2066 to required one
    $input.prop('type', 'text');
});
</script>