I have been testing my website in Chrome and have everything working as expected, but I just found out my font does not get imported in Safari and the default font is used instead of the one I'm supposed to be using. I included a snippet showing how I'm importing and using the font - maybe I need to access the font in a different way to have it available to use in both browsers?
const context = document.querySelector("canvas").getContext("2d");
context.width = document.body.clientWidth;
context.height = document.body.clientHeight;
context.beginPath();
context.font = "10vw Montserrat";
context.fillStyle = "red";
context.textAlign="center";
context.textBaseline = "middle";
context.fillText("XXXXXX", context.width/2, context.height/2);
context.closePath();
@import url('https://fonts.googleapis.com/css?family=Montserrat:900i&display=swap');
<canvas class="game"></canvas>