Shape doesn't close

Small circles do not close properly

HTML

<script src="https://cdn.rawgit.com/mrdoob/three.js/dev/build/three.min.js"></script>

JavaScript

var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 100);
camera.position.z = 35;

var scene = new THREE.Scene();

var light = new THREE.PointLight();
light.position.set(0, 20, 50);
scene.add(light);

var renderer = renderer = new THREE.WebGLRenderer({
    antialias: true,
    alpha: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var outerRadius = 10;
var innerRadius = 9;

var arcShape = new THREE.Shape();
arcShape.moveTo(outerRadius, 0);
arcShape.absarc(0, 0, outerRadius, 0, Math.PI * 2, false);

var holePath = new THREE.Path();
holePath.moveTo(innerRadius, 0);
holePath.absarc(0, 0, innerRadius, 0, Math.PI * 2, true);
arcShape.holes.push(holePath);

var extrudeSettings = {
  amount: 3,
  bevelEnabled: false,
  curveSegments: 40,
  material: 0,
  extrudeMaterial: 1
};

var geometry = new THREE.ExtrudeGeometry(arcShape, extrudeSettings);

geometry.computeBoundingBox();
geometry.computeVertexNormals();

for ( var i = 0; i < geometry.faces.length; i ++ ) {
    var face = geometry.faces[ i ];
    if (face.materialIndex == 1 ) {
        for ( var j = 0; j < face.vertexNormals.length; j ++ ) {
            face.vertexNormals[ j ].z = 0;
            face.vertexNormals[ j ].normalize();
        }
    }
}

var material = new THREE.MultiMaterial( [
	new THREE.MeshPhongMaterial( { color: 0xf00fff, shading: THREE.FlatShading } ), // front
	new THREE.MeshPhongMaterial( { color: 0xf00fff, shading: THREE.SmoothShading } ) // side
] );

var mesh = new THREE.Mesh(geometry, material);

mesh.position.set(0, 0, 0);

scene.add(mesh);

animate();

function animate() {
    requestAnimationFrame(animate);
    mesh.rotation.y -= 0.01;
    renderer.render(scene, camera);
}