Create a copyable link of an article in drupal

copy-url.html.twig

<div class="article__copy-link__container">
    <div class="button--group-message article__copy-link js-copy-wrap">
        <a class="button button--secondary button--icon button--icon-left button--has-message button--copy-link js-copy-link" href="#">
            {{ 'Copy the link'|t }}
            <svg class="icon icon--link">
                <use xlink:href="#icon-link"/>
            </svg>
        </a>
        <div class="button__message js-copy-message">
            {{ 'Link copied to clipboard'|t }}
        </div>
        {# link is copied from this hidden textfield #}
        <input class="sr-only" type="text" id="copyfield" value="{{ url('<current>') }}" readonly>
        <label class="sr-only" for="copyfield">{{ 'link to share'|t }}</label>

    </div>
</div>

copy-url.js

(function ($, Drupal, drupalSettings) {

  Drupal.behaviors.copyUrl = {
    attach: function (context) {
      $('body').on('click', '.js-copy-link', function(e){
        e.preventDefault();
        $input = $(this).parents('.js-copy-wrap').find('input');
        $message = $(this).parents('.js-copy-wrap').find('.js-copy-message');
        $input.select();
        try {
          result = document.execCommand('copy');
          var msg = result ? 'successful' : 'unsuccessful';
          console.log('Copying text command was ' + msg);
          $message.show();
          setTimeout( "$message.fadeOut();", 3000);
        } catch (err) {
          console.log('Oops, unable to copy');
        }
      });
    }
  };

})(jQuery, Drupal, drupalSettings);