diff --git a/src/Skinner.js b/src/Skinner.js
index 87c5a7be7f..d17bc1782a 100644
--- a/src/Skinner.js
+++ b/src/Skinner.js
@@ -50,8 +50,8 @@ class Skinner {
             return null;
         }
 
-        // components have to be functions.
-        const validType = typeof comp === 'function';
+        // components have to be functions or forwardRef objects with a render function.
+        const validType = typeof comp === 'function' || comp.render;
         if (!validType) {
             throw new Error(`Not a valid component: ${name} (type = ${typeof(comp)}).`);
         }
diff --git a/test/components/structures/MessagePanel-test.js b/test/components/structures/MessagePanel-test.js
index 0bcdfcd5e5..0cb7e2cc71 100644
--- a/test/components/structures/MessagePanel-test.js
+++ b/test/components/structures/MessagePanel-test.js
@@ -53,7 +53,7 @@ class WrappedMessagePanel extends React.Component {
 
     render() {
         return <MatrixClientContext.Provider value={client}>
-            <RoomContext.Provider value={{ canReact: true, canReply: true }}>
+            <RoomContext.Provider value={{ canReact: true, canReply: true, room, roomId: room.roomId }}>
                 <MessagePanel room={room} {...this.props} resizeNotifier={this.state.resizeNotifier} />
             </RoomContext.Provider>
         </MatrixClientContext.Provider>;