Remove extraenous DOM nodes

src/components/structures/ContextMenu.tsx

@@ -389,7 +389,7 @@ export class ContextMenu extends React.PureComponent<IProps, IState> {
     }
 
     render(): React.ReactChild {
-        return ReactDOM.createPortal(this.renderMenu(), getOrCreateContainer());
+        return ReactDOM.createPortal(this.renderMenu(), document.body);
     }
 }
 

src/components/structures/ToastContainer.tsx

@@ -55,6 +55,7 @@ export default class ToastContainer extends React.Component<{}, IState> {
         const totalCount = this.state.toasts.length;
         const isStacked = totalCount > 1;
         let toast;
+        let containerClasses;
         if (totalCount !== 0) {
             const topToast = this.state.toasts[0];
             const {title, icon, key, component, className, props} = topToast;
@@ -79,16 +80,17 @@ export default class ToastContainer extends React.Component<{}, IState> {
                 </div>
                 <div className="mx_Toast_body">{React.createElement(component, toastProps)}</div>
             </div>);
-        }
 
-        const containerClasses = classNames("mx_ToastContainer", {
+            containerClasses = classNames("mx_ToastContainer", {
                 "mx_ToastContainer_stacked": isStacked,
             });
-
+        }
-        return (
+        return toast
+            ? (
                 <div className={containerClasses} role="alert">
                     {toast}
                 </div>
-        );
+            )
+            : null;
     }
 }

src/components/views/rooms/RoomHeader.js

@@ -257,8 +257,7 @@ export default class RoomHeader extends React.Component {
         const e2eIcon = this.props.e2eStatus ? <E2EIcon status={this.props.e2eStatus} /> : undefined;
 
         return (
-            <div className="mx_RoomHeader light-panel">
+            <div className="mx_RoomHeader mx_RoomHeader_wrapper light-panel" aria-owns="mx_RightPanel">
-                <div className="mx_RoomHeader_wrapper" aria-owns="mx_RightPanel">
                 <div className="mx_RoomHeader_avatar">{ roomAvatar }</div>
                 <div className="mx_RoomHeader_e2eIcon">{ e2eIcon }</div>
                 { name }
@@ -267,7 +266,6 @@ export default class RoomHeader extends React.Component {
                 { rightRow }
                 <RoomHeaderButtons />
             </div>
-            </div>
         );
     }
 }

src/components/views/rooms/SimpleRoomHeader.js

@@ -62,15 +62,13 @@ export default class SimpleRoomHeader extends React.Component {
         }
 
         return (
-            <div className="mx_RoomHeader" >
+            <div className="mx_RoomHeader mx_RoomHeader_wrapper" >
-                <div className="mx_RoomHeader_wrapper">
                 <div className="mx_RoomHeader_simpleHeader">
                     { icon }
                     { this.props.title }
                     { cancelButton }
                 </div>
             </div>
-            </div>
         );
     }
 }

src/components/views/rooms/WhoIsTypingTile.js

@@ -204,7 +204,7 @@ export default class WhoIsTypingTile extends React.Component {
             this.props.whoIsTypingLimit,
         );
         if (!typingString) {
-            return (<div className="mx_WhoIsTypingTile_empty" />);
+            return null;
         }
 
         return (