window-fix

src/components/Article/FullArticle.tsx

@@ -57,8 +57,8 @@ export type ArticlePageSearchParams = {
 
 const scrollTo = (el: HTMLElement) => {
   const { top } = el.getBoundingClientRect()
-  if (window)
-    window.scrollTo({
+
+  window?.scrollTo({
     top: top + window.scrollY - DEFAULT_HEADER_OFFSET,
     left: 0,
     behavior: 'smooth'
@@ -270,7 +270,8 @@ export const FullArticle = (props: Props) => {
   // Check iframes size
   let articleContainer: HTMLElement | undefined
   const updateIframeSizes = () => {
-    if (!(articleContainer && props.article.body && window)) return
+    if (!window) return
+    if (!(articleContainer && props.article.body)) return
     const iframes = articleContainer?.querySelectorAll('iframe')
     if (!iframes) return
     const containerWidth = articleContainer?.offsetWidth

src/components/Nav/Header/Header.tsx

@@ -71,7 +71,7 @@ export const Header = (props: Props) => {
     const mainContent = document.querySelector<HTMLDivElement>('.main-content')
 
     if (fixed() || modal() !== null) {
-      windowScrollTop = window.scrollY
+      windowScrollTop = window?.scrollY || 0
       if (mainContent) mainContent.style.marginTop = `-${windowScrollTop}px`
     }
 
@@ -79,7 +79,7 @@ export const Header = (props: Props) => {
     document.body.classList.toggle(styles.fixed, fixed() && !modal())
 
     if (!(fixed() || modal())) {
-      window.scrollTo(0, windowScrollTop)
+      window?.scrollTo(0, windowScrollTop)
       if (mainContent) mainContent.style.marginTop = ''
     }
   })

src/components/NotificationsPanel/NotificationsPanel.tsx

@@ -75,7 +75,7 @@ export const NotificationsPanel = (props: Props) => {
     const mainContent = document.querySelector<HTMLDivElement>('.main-content')
 
     if (props.isOpen && mainContent && window) {
-      windowScrollTop = window.scrollY
+      windowScrollTop = window?.scrollY || 0
       mainContent.style.marginTop = `-${windowScrollTop}px`
     }
 
@@ -83,7 +83,7 @@ export const NotificationsPanel = (props: Props) => {
 
     if (!props.isOpen && mainContent && window) {
       mainContent.style.marginTop = ''
-      window.scrollTo(0, windowScrollTop)
+      window?.scrollTo(0, windowScrollTop)
     }
   })
 

src/components/TableOfContents/TableOfContents.tsx

@@ -20,12 +20,11 @@ const isInViewport = (el: Element): boolean => {
   return rect.top <= DEFAULT_HEADER_OFFSET + 24 // default offset + 1.5em (default header margin-top)
 }
 const scrollToHeader = (element: HTMLElement) => {
-  if (window)
-    window.scrollTo({
+  window?.scrollTo({
     behavior: 'smooth',
     top:
       element.getBoundingClientRect().top -
-        document.body.getBoundingClientRect().top -
+      document?.body.getBoundingClientRect().top -
       DEFAULT_HEADER_OFFSET
   })
 }

src/components/Views/EditView/EditSettingsView.tsx

@@ -33,7 +33,7 @@ const AUTO_SAVE_DELAY = 3000
 
 const handleScrollTopButtonClick = (ev: MouseEvent | TouchEvent) => {
   ev.preventDefault()
-  window.scrollTo({
+  window?.scrollTo({
     top: 0,
     behavior: 'smooth'
   })

src/components/Views/EditView/EditView.tsx

@@ -55,7 +55,7 @@ const AUTO_SAVE_DELAY = 3000
 
 const handleScrollTopButtonClick = (ev: MouseEvent | TouchEvent) => {
   ev.preventDefault()
-  window.scrollTo({
+  window?.scrollTo({
     top: 0,
     behavior: 'smooth'
   })

src/components/Views/Profile/ProfileSecurity.tsx

@@ -87,8 +87,8 @@ export const ProfileSecurityView = (_props: any) => {
     handleInputChange('newPasswordConfirm', value)
     if (newPasswordRepeatRef && value !== formData()['newPassword']) {
       const rect = newPasswordRepeatRef.getBoundingClientRect()
-      const topPosition = window.scrollY + rect.top - DEFAULT_HEADER_OFFSET * 2
-      window.scrollTo({
+      const topPosition = (window?.scrollY || 0) + rect.top - DEFAULT_HEADER_OFFSET * 2
+      window?.scrollTo({
         top: topPosition,
         left: 0,
         behavior: 'smooth'
@@ -117,8 +117,8 @@ export const ProfileSecurityView = (_props: any) => {
           setOldPasswordError(t('Incorrect old password'))
           showSnackbar({ type: 'error', body: t('Incorrect old password') })
           const rect = oldPasswordRef.getBoundingClientRect()
-          const topPosition = window.scrollY + rect.top - DEFAULT_HEADER_OFFSET * 2
-          window.scrollTo({
+          const topPosition = (window?.scrollY || 0) + rect.top - DEFAULT_HEADER_OFFSET * 2
+          window?.scrollTo({
             top: topPosition,
             left: 0,
             behavior: 'smooth'

src/context/topics.tsx

@@ -44,7 +44,7 @@ const STORE_NAME = 'topics'
 const CACHE_LIFETIME = 24 * 60 * 60 * 1000 // один день в миллисекундах
 
 const setupIndexedDB = async () => {
-  if (!('indexedDB' in window)) {
+  if (window && !('indexedDB' in window)) {
     console.error("This browser doesn't support IndexedDB")
     return
   }

src/intl/Translatable.tsx

@@ -35,15 +35,15 @@ export default function TranslationWrapper(props: TranslationWrapperProps): JSX.
   const [isTranslating, setIsTranslating] = createSignal(false)
 
   onMount(async () => {
-    if ('translation' in window) {
-      const translation = (window as Window).translation
+    if (window && 'translation' in window) {
+      const translation = (window as Window)?.translation
 
       const canTranslate = await translation?.canTranslate({
         sourceLanguage: props.sourceLanguage || 'ru',
         targetLanguage: props.targetLanguage
       })
 
-      if (canTranslate !== 'no') {
+      if (translation && canTranslate !== 'no') {
         setIsTranslating(true)
 
         try {

src/routes/[slug].tsx

@@ -48,9 +48,9 @@ export default (props: RouteSectionProps<{ article: Shout }>) => {
       (a?: Shout) => {
         if (!a) return
         console.debug('[routes.slug] article found')
-        window.gtag?.('event', 'page_view', {
+        window?.gtag?.('event', 'page_view', {
           page_title: a.title,
-          page_location: window.location.href,
+          page_location: window?.location.href || '',
           page_path: loc.pathname
         })
       },

src/routes/author/[slug]/[tab].tsx

@@ -40,10 +40,10 @@ export default (props: RouteSectionProps<{ articles: Shout[] }>) => {
   createReaction(() => {
     if (author()) {
       console.debug('[routes.slug] article signal changed once')
-      window.gtag?.('event', 'page_view', {
+      window?.gtag?.('event', 'page_view', {
         page_title: author()?.name || '',
-        page_location: window.location.href,
-        page_path: window.location.pathname
+        page_location: window?.location.href || '',
+        page_path: window?.location.pathname || ''
       })
     }
   })

src/routes/edit/new.tsx

@@ -78,7 +78,7 @@ export default () => {
               </div>
             </li>
           </ul>
-          <Button value={t('Back')} onClick={() => window.history.back()} />
+          <Button value={t('Back')} onClick={() => window?.history.back()} />
         </article>
       </AuthGuard>
     </PageLayout>

src/routes/topic/[slug].tsx

@@ -1,5 +1,5 @@
 import { RouteSectionProps, createAsync, useParams } from '@solidjs/router'
-import { ErrorBoundary, Suspense, createMemo, createReaction } from 'solid-js'
+import { ErrorBoundary, Suspense, createEffect, createMemo } from 'solid-js'
 import { FourOuFourView } from '~/components/Views/FourOuFour'
 import { TopicView } from '~/components/Views/Topic'
 import { Loading } from '~/components/_shared/Loading'
@@ -34,16 +34,12 @@ export default (props: RouteSectionProps<{ articles: Shout[] }>) => {
   const { t } = useLocalize()
   const topic = createMemo(() => topicEntities?.()[params.slug])
   const title = createMemo(() => `${t('Discours')} :: ${topic()?.title || ''}`)
-
-  // docs: `a side effect that is run the first time the expression
-  // wrapped by the returned tracking function is notified of a change`
-  createReaction(() => {
-    if (topic()) {
-      console.debug('[routes.slug] article signal changed once')
-      window.gtag?.('event', 'page_view', {
+  createEffect(() => {
+    if (topic() && window) {
+      window?.gtag?.('event', 'page_view', {
         page_title: topic()?.title,
-        page_location: window.location.href,
-        page_path: window.location.pathname
+        page_location: window?.location.href,
+        page_path: window?.location.pathname
       })
     }
   })

src/utils/scroll.ts

@@ -11,7 +11,7 @@ export const saveScrollPosition = () => {
 }
 
 export const restoreScrollPosition = () => {
-  window.scroll({
+  window?.scroll({
     top: scrollPosition.top,
     left: scrollPosition.left
   })
@@ -21,7 +21,7 @@ export const scrollHandler = (elemId: string, offset = -100) => {
   const anchor = document.querySelector(`#${elemId}`)
 
   if (anchor && window) {
-    window.scrollTo({
+    window?.scrollTo?.({
       top: anchor.getBoundingClientRect().top + offset,
       behavior: 'smooth'
     })