Webgl orthographic projection depth issue

See more:

Javascript

WebGL

Using WebGL, I'm initialising my projection matrix with the following code, using gl-matrix;

const matrix = mat4.create();
mat4.ortho(matrix, -width / 2, width / 2, -height / 2, height / 2, Number.MIN_SAFE_INTEGER, Number.MAX_SAFE_INTEGER);

where width and height are the window dimensions.

The viewport is set up as such;

gl.viewport(0, 0, width, height);
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.clearDepth(1.0);
gl.enable(gl.DEPTH_TEST);
gl.depthFunc(gl.LEQUAL);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

For some reason, the faces' depths are being calculated incorrectly, but it works fine with a perspective projection. How can I fix this?

See image here[^]

What I have tried:

Playing around with depth parameters and methods, googling for an hour