Enable stricter Typescript options (#30435)

app/javascript/entrypoints/public.tsx

@@ -65,7 +65,7 @@ window.addEventListener('message', (e) => {
       {
         type: 'setHeight',
         id: data.id,
-        height: document.getElementsByTagName('html')[0].scrollHeight,
+        height: document.getElementsByTagName('html')[0]?.scrollHeight,
       },
       '*',
     );
@@ -135,7 +135,7 @@ function loaded() {
     );
   };
   const todayFormat = new IntlMessageFormat(
-    localeData['relative_format.today'] || 'Today at {time}',
+    localeData['relative_format.today'] ?? 'Today at {time}',
     locale,
   );
 
@@ -288,13 +288,13 @@ function loaded() {
       if (statusEl.dataset.spoiler === 'expanded') {
         statusEl.dataset.spoiler = 'folded';
         this.textContent = new IntlMessageFormat(
-          localeData['status.show_more'] || 'Show more',
+          localeData['status.show_more'] ?? 'Show more',
           locale,
         ).format() as string;
       } else {
         statusEl.dataset.spoiler = 'expanded';
         this.textContent = new IntlMessageFormat(
-          localeData['status.show_less'] || 'Show less',
+          localeData['status.show_less'] ?? 'Show less',
           locale,
         ).format() as string;
       }
@@ -316,8 +316,8 @@ function loaded() {
 
       const message =
         statusEl.dataset.spoiler === 'expanded'
-          ? localeData['status.show_less'] || 'Show less'
+          ? localeData['status.show_less'] ?? 'Show less'
-          : localeData['status.show_more'] || 'Show more';
+          : localeData['status.show_more'] ?? 'Show more';
       spoilerLink.textContent = new IntlMessageFormat(
         message,
         locale,

app/javascript/entrypoints/remote_interaction_helper.ts

@@ -67,7 +67,9 @@ const fetchInteractionURLFailure = () => {
   );
 };
 
-const isValidDomain = (value: string) => {
+const isValidDomain = (value: unknown) => {
+  if (typeof value !== 'string') return false;
+
   const url = new URL('https:///path');
   url.hostname = value;
   return url.hostname === value;
@@ -124,6 +126,11 @@ const fromAcct = (acct: string) => {
   const domain = segments[1];
   const fallbackTemplate = `https://${domain}/authorize_interaction?uri={uri}`;
 
+  if (!domain) {
+    fetchInteractionURLFailure();
+    return;
+  }
+
   axios
     .get(`https://${domain}/.well-known/webfinger`, {
       params: { resource: `acct:${acct}` },

app/javascript/mastodon/components/animated_number.tsx

@@ -48,8 +48,9 @@ export const AnimatedNumber: React.FC<Props> = ({ value }) => {
             <span
               key={key}
               style={{
-                position: direction * style.y > 0 ? 'absolute' : 'static',
+                position:
-                transform: `translateY(${style.y * 100}%)`,
+                  direction * (style.y ?? 0) > 0 ? 'absolute' : 'static',
+                transform: `translateY(${(style.y ?? 0) * 100}%)`,
               }}
             >
               <ShortNumber value={data as number} />

app/javascript/mastodon/components/hashtag_bar.tsx

@@ -52,7 +52,10 @@ function uniqueHashtagsWithCaseHandling(hashtags: string[]) {
   );
 
   return Object.values(groups).map((tags) => {
-    if (tags.length === 1) return tags[0];
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- we know that the array has at least one element
+    const firstTag = tags[0]!;
+
+    if (tags.length === 1) return firstTag;
 
     // The best match is the one where we have the less difference between upper and lower case letter count
     const best = minBy(tags, (tag) => {
@@ -66,7 +69,7 @@ function uniqueHashtagsWithCaseHandling(hashtags: string[]) {
       return Math.abs(lowerCase - upperCase);
     });
 
-    return best ?? tags[0];
+    return best ?? firstTag;
   });
 }
 

app/javascript/mastodon/components/short_number.tsx

@@ -48,7 +48,7 @@ const ShortNumberCounter: React.FC<ShortNumberCounterProps> = ({ value }) => {
 
   const count = (
     <FormattedNumber
-      value={rawNumber}
+      value={rawNumber ?? 0}
       maximumFractionDigits={maxFractionDigits}
     />
   );

app/javascript/mastodon/features/emoji/emoji_mart_data_light.ts

@@ -29,7 +29,10 @@ const emojis: Emojis = {};
 
 // decompress
 Object.keys(shortCodesToEmojiData).forEach((shortCode) => {
-  const [_filenameData, searchData] = shortCodesToEmojiData[shortCode];
+  const emojiData = shortCodesToEmojiData[shortCode];
+  if (!emojiData) return;
+
+  const [_filenameData, searchData] = emojiData;
   const [native, short_names, search, unified] = searchData;
 
   emojis[shortCode] = {

app/javascript/mastodon/features/emoji/emoji_unicode_mapping_light.ts

@@ -46,7 +46,10 @@ function processEmojiMapData(
 Object.keys(shortCodesToEmojiData).forEach(
   (shortCode: ShortCodesToEmojiDataKey) => {
     if (shortCode === undefined) return;
-    const [filenameData, _searchData] = shortCodesToEmojiData[shortCode];
+
+    const emojiData = shortCodesToEmojiData[shortCode];
+    if (!emojiData) return;
+    const [filenameData, _searchData] = emojiData;
     filenameData.forEach((emojiMapData) => {
       processEmojiMapData(emojiMapData, shortCode);
     });

app/javascript/mastodon/store/middlewares/sounds.ts

@@ -74,8 +74,9 @@ export const soundsMiddleware = (): Middleware<
     if (isActionWithMetaSound(action)) {
       const sound = action.meta.sound;
 
-      if (sound && Object.hasOwn(soundCache, sound)) {
+      if (sound) {
-        play(soundCache[sound]);
+        const s = soundCache[sound];
+        if (s) play(s);
       }
     }
 

tsconfig.json

@@ -7,6 +7,8 @@
     "allowJs": true,
     "noEmit": true,
     "strict": true,
+    "noImplicitReturns": true,
+    "noUncheckedIndexedAccess": true,
     "esModuleInterop": true,
     "skipLibCheck": true,
     "baseUrl": "./",