Use new renderer methods to check for WebGL.

Remove the WebGL checks from the error boundary. Instead, just do not
render the stage if it is not supported.

package.json

@@ -90,7 +90,7 @@
     "scratch-blocks": "0.1.0-prerelease.1515707006",
     "scratch-l10n": "2.0.20180108132626",
     "scratch-paint": "0.1.0-prerelease.20180110204944",
-    "scratch-render": "0.1.0-prerelease.1515614083",
+    "scratch-render": "0.1.0-prerelease.1515699707",
     "scratch-storage": "0.3.0",
     "scratch-vm": "0.1.0-prerelease.1515691021-prerelease.1515691035",
     "selenium-webdriver": "3.5.0",

src/components/gui/gui.jsx

@@ -6,6 +6,7 @@ import MediaQuery from 'react-responsive';
 import {FormattedMessage} from 'react-intl';
 import tabStyles from 'react-tabs/style/react-tabs.css';
 import VM from 'scratch-vm';
+import Renderer from 'scratch-render';
 
 import Blocks from '../../containers/blocks.jsx';
 import CostumeTab from '../../containers/costume-tab.jsx';
@@ -63,6 +64,8 @@ const GUIComponent = props => {
         tabSelected: classNames(tabStyles.reactTabsTabSelected, styles.isSelected)
     };
 
+    const isRendererSupported = Renderer.isSupported();
+
     return (
         <Box
             className={styles.pageWrapper}
@@ -74,7 +77,9 @@ const GUIComponent = props => {
             {feedbackFormVisible ? (
                 <FeedbackForm />
             ) : null}
-            {(window.WebGLRenderingContext) ? null : (<WebGlModal />)}
+            {isRendererSupported ? null : (
+                <WebGlModal />
+            )}
             <MenuBar />
             <Box className={styles.bodyWrapper}>
                 <Box className={styles.flexWrapper}>
@@ -127,14 +132,18 @@ const GUIComponent = props => {
                             <StageHeader vm={vm} />
                         </Box>
                         <Box className={styles.stageWrapper}>
-                            <MediaQuery minWidth={layout.fullSizeMinWidth}>{isFullSize => (
-                                <Stage
-                                    height={isFullSize ? layout.fullStageHeight : layout.smallerStageHeight}
-                                    shrink={0}
-                                    vm={vm}
-                                    width={isFullSize ? layout.fullStageWidth : layout.smallerStageWidth}
-                                />
-                            )}</MediaQuery>
+                            {/* eslint-disable arrow-body-style */}
+                            <MediaQuery minWidth={layout.fullSizeMinWidth}>{isFullSize => {
+                                return isRendererSupported ? (
+                                    <Stage
+                                        height={isFullSize ? layout.fullStageHeight : layout.smallerStageHeight}
+                                        shrink={0}
+                                        vm={vm}
+                                        width={isFullSize ? layout.fullStageWidth : layout.smallerStageWidth}
+                                    />
+                                ) : null;
+                            }}</MediaQuery>
+                            {/* eslint-enable arrow-body-style */}
                         </Box>
                         <Box className={styles.targetWrapper}>
                             <TargetPane

src/containers/error-boundary.jsx

@@ -28,14 +28,6 @@ class ErrorBoundary extends React.Component {
             if (platform.name === 'IE') {
                 return <BrowserModalComponent onBack={this.handleBack} />;
             }
-            if (window.WebGLRenderingContext) {
-                const canvas = document.createElement('canvas');
-                if (!canvas.getContext('webgl') && !canvas.getContext('experimental-webgl')) {
-                    return <WebGlModalComponent onBack={this.handleBack} />;
-                }
-            } else {
-                return <WebGlModalComponent onBack={this.handleBack} />;
-            }
             return (
                 <div style={{margin: '2rem'}}>
                     <h1>Oops! Something went wrong.</h1>