subtracted geometries result in strange lighting

In three.js, I am trying to 'cut out' a window from a box geometry (a wall), using this csg (contructive solid geometry) extension I found here: https://github.com/chandlerprall/ThreeCSG

I am successful in cutting the window, but then the surface of the result reflects light very strangely, see below (first normal, then the wall with window)

var leftWallGeometry = new THREE.BoxGeometry( $scope.wall.width, $scope.room.height, $scope.room.depth);
var leftWallMesh = new THREE.Mesh( leftWallGeometry );

var leftWallBSP = new ThreeBSP( leftWallMesh );

var leftWindowGeometry = new THREE.BoxGeometry($scope.wall.width +10, 100, 100 );
var leftWindowMesh = new THREE.Mesh( leftWindowGeometry)

var leftWindowBSP = new ThreeBSP( leftWindowMesh );

var windowWallBSP = leftWallBSP.subtract( leftWindowBSP );
var result = windowWallBSP.toMesh( wallMaterial );
result.geometry.computeVertexNormals();

result.position.x = $scope.room.width / -2
result.position.y = $scope.room.height / 2
$scope.scene.add( result ); 

The wall material is MeshPhongMaterial with repeated texture and bump map.

var wallTexture = new THREE.ImageUtils.loadTexture('img/wall_diffuse_0.jpg')
// wall bump texture
var wallBumpTexture = new THREE.ImageUtils.loadTexture('img/bump_1.jpg')


// repeate wall texture and wall bump texture
wallTexture.wrapS = wallTexture.wrapT = THREE.RepeatWrapping; 
wallTexture.repeat.set( 10, 10 );

wallBumpTexture.wrapS = wallBumpTexture.wrapT = THREE.RepeatWrapping; 
wallBumpTexture.repeat.set( 10, 10 );

var wallMaterial = new THREE.MeshPhongMaterial( { map: wallTexture, bumpMap: wallBumpTexture, bumpScale: 0.2} );

I would be grateful for any suggestions on how to fix this strange light/reflection issue. OR how else to cut windows from walls/boxes in three.js.

Try setting the shading of the Material of the wall to Flat Shading:

wallMaterial.shading = THREE.FlatShading;

Example picture of properly shaded wall: