JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.3.0/fabric.js"></script>
<p>
VAVAVAVA - P
</p>
<canvas id="a"></canvas><br />
<canvas id="b"></canvas>

CSS

p {
  margin: 0;
  font-size: 40px;
  font-family: verdana;
  font-kerning: normal;
}
canvas: {
  margin: 0;
}
#a {
  font-feature-settings: "kern" 1;  
}
#b {
  margin-top: -105px;
  font-kerning: normal;
}

JavaScript

var canvas = document.getElementById('a');
var ctx = canvas.getContext('2d');

canvas.style.fontFeatureSettings = 'kern';

ctx.font = 'normal normal 40px verdana'
ctx.measureText('VA')
ctx.fillText('VAVAVAVA - A', 0, 40);

var canvasB = document.getElementById('b');
var ctxB = canvasB.getContext('2d');

canvasB.style.fontKerning = 'none';

ctxB.font = 'normal normal 40px verdana'
ctxB.measureText('VA')
ctxB.fillText('VAVAVAVA - B', 0, 40);