I have always used this jQuery script for smooth scrolling:

var root = $('html, body');
$('a[href^="#"]').click(function() {
root.animate({
    scrollTop: $($.attr(this, 'href')).offset().top
}, 1000);
return false;
});

How can I do this with vanilla JavaScript? I have tried this:

document.querySelector(this.getAttribute('href')).scrollIntoView({
    behavior: 'smooth'
});

But it doesn't work with Safari, which is a deal breaker for me.