diff --git a/examples/context_assignment_test.html b/examples/context_assignment_test.html
new file mode 100644
index 0000000000000000000000000000000000000000..7fcd0927c425bf236d09eaa57a66279b3810b8a7
--- /dev/null
+++ b/examples/context_assignment_test.html
@@ -0,0 +1,73 @@
+<html>
+	<head>
+		<title>Pre-created Context Assignment Test</title>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <script src="../build/three.js" type="text/javascript"></script>
+    
+    <script type="text/javascript">
+      var canvasgl;
+      var gl;
+      
+	function test_context_set() {
+	container = document.getElementById( 'container' );
+        canvasgl = document.getElementById("canvasgl");
+      
+        webgl_init(canvasgl);     
+
+	renderer = new THREE.WebGLRenderer( { givenGLContext:gl } );
+	renderer.setSize( 256, 256 );    
+	renderer.setClearColor(0xff0000, 1);; 
+	renderer.clear( );
+
+	//not needed when setting context from application
+	//container.appendChild( renderer.domElement );    
+      }
+      
+      	//GL init call
+	function webgl_init() {
+        gl = null;
+        
+        try {
+          gl = canvasgl.getContext("webgl") || canvasgl.getContext("experimental-webgl");
+        }
+        catch(e) {
+        }
+        
+        if (!gl) {
+          alert("Sorry, we tried. Could not get WebGL");
+        }
+      }
+    </script>
+  </head>
+	
+	<style type="text/css">
+    #canvas {
+      width: 256px;
+      height: 256px;
+      background-color: green;
+    }
+    #canvasgl {
+      width: 256px;
+      height: 256px;
+    }
+
+	</style>
+	
+	<body onload="test_context_set()">
+<div id="container">
+This test checks if Three.js successfully used the pre-created GL context passed from framework outside of Three.js. <br>For more information refer to <a href="https://github.com/mrdoob/three.js/pull/4353">this issue list in Three.js github</a><hr> The screen should show 2 square boxes of size 256x256, one filled by CSS in green color, and the other filled by WebGL in red color. If the red box is shown and same in size to the green box, it indicates that the test is successful.
+<br>
+<canvas id="canvas"></canvas>
+<br>
+The above is the CSS filled box, not GL, in Green color.
+<br><hr>
+The below is the GL filled box, not CSS, in Red color.
+<br>
+    <canvas id="canvasgl" >
+		</canvas>
+</div>
+<hr>
+Prabindh Sundareson
+	</body>
+</html>
+
diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js
index 505b5b2d91493d019bdf93ae61b59c2c16558d9b..4793eed49ad0ae7748b1dca8334f7db91fcffb2f 100644
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -12,6 +12,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 	parameters = parameters || {};
 
 	var _canvas = parameters.canvas !== undefined ? parameters.canvas : document.createElement( 'canvas' ),
+	_givenGLContext = parameters.givenGLContext !== undefined ? parameters.givenGLContext : null,
 
 	_precision = parameters.precision !== undefined ? parameters.precision : 'highp',
 
@@ -6517,7 +6518,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 				preserveDrawingBuffer: _preserveDrawingBuffer
 			};
 
-			_gl = _canvas.getContext( 'webgl', attributes ) || _canvas.getContext( 'experimental-webgl', attributes );
+			_gl = _givenGLContext || _canvas.getContext( 'webgl', attributes ) || _canvas.getContext( 'experimental-webgl', attributes );
 
 			if ( _gl === null ) {
 
