Why can't I apply this specific invert clip to a shape?

Question

I’m trying to apply an invert clip to a shape, but, for this specific clip shape, the clip is not being applied to the shape. It works if the clip is not inverted, and it works with other clips, such as ellipses, simple shapes and shapes with bezier curves.

I'm working with p5.js.

Here is the code:

function setup() {
  createCanvas(400, 400);
  background(200);

  push();
  translate(-130, 50);

  beginClip({
    invert: true
  });
  beginShape();
  vertex(332.83, 125.59);
  bezierVertex(308.92, 125.59, 303.01, 143.18, 303.01, 153.9);
  vertex(364.44, 153.9);
  bezierVertex(364.44, 143.45, 358.67, 125.59, 332.83, 125.59);
  endShape(CLOSE);
  endClip();

  beginShape();
  vertex(397.15, 174.93);
  vertex(303.42, 174.93);
  bezierVertex(304.66, 187.99, 317.71, 194.58, 339.15, 194.58);
  bezierVertex(371.31, 194.58, 394.26, 186.33, 395.5, 185.92);
  vertex(395.5, 212.86);
  bezierVertex(394.54, 213.27, 376.81, 221.79, 337.23, 221.79);
  bezierVertex(289.95, 221.79, 267.96, 199.66, 267.96, 162.42);
  bezierVertex(267.96, 125.18, 292.42, 100.85, 332.56, 100.85);
  bezierVertex(379.15, 100.85, 397.43, 132.32, 397.43, 165.17);
  bezierVertex(397.43, 168.61, 397.43, 172.18, 397.16, 174.93);
  endShape(CLOSE);

  pop();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.10.0/p5.js"></script>