fix useViewportSize for ssr environment (#5163)

Author: yarastqt

packages/@react-aria/utils/src/useViewportSize.ts

@@ -11,6 +11,7 @@
  */
 
 import {useEffect, useState} from 'react';
+import {useIsSSR} from '@react-aria/ssr';
 
 interface ViewportSize {
   width: number,
@@ -21,7 +22,8 @@ interface ViewportSize {
 let visualViewport = typeof document !== 'undefined' && window.visualViewport;
 
 export function useViewportSize(): ViewportSize {
-  let [size, setSize] = useState(() => getViewportSize());
+  let isSSR = useIsSSR();
+  let [size, setSize] = useState(() => isSSR ? {width: 0, height: 0} : getViewportSize());
 
   useEffect(() => {
     // Use visualViewport api to track available height even on iOS virtual keyboard opening

packages/@react-aria/utils/test/useViewportSize.ssr.test.tsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import {testSSR} from '@react-spectrum/test-utils';
+
+describe('useViewportSize SSR', () => {
+  it('should render without errors', async () => {
+    await testSSR(__filename, `
+      import {useViewportSize} from '../src';
+
+      function Viewport() {
+        useViewportSize();
+        return null;
+      }
+
+      <Viewport />
+    `);
+  });
+});