fix(utils): Remove Element dom type (#5675)

This PR removes the use of the `Element` DOM type from `@sentry/utils`, introduced with #5594. This breaks `@sentry/node` users that use strict TS configs.

We have to cast the type to `any` to make sure it works in different environments, but we supply a generic argument so that users can specify what type of `Element` will be returned from `querySelector`.

Author: AbhiPrasad

packages/tracing/src/browser/browsertracing.ts

@@ -294,6 +294,10 @@ export function extractTraceDataFromMetaTags(): Partial<TransactionContext> | un
 
 /** Returns the value of a meta tag */
 export function getMetaContent(metaName: string): string | null {
+  // Can't specify generic to `getDomElement` because tracing can be used
+  // in a variety of environments, have to disable `no-unsafe-member-access`
+  // as a result.
   const metaTag = getDomElement(`meta[name=${metaName}]`);
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
   return metaTag ? metaTag.getAttribute('content') : null;
 }

packages/utils/src/browser.ts

@@ -129,14 +129,21 @@ export function getLocationHref(): string {
  * This wrapper will first check for the existance of the function before
  * actually calling it so that we don't have to take care of this check,
  * every time we want to access the DOM.
- * Reason: DOM/querySelector is not available in all environments
+ *
+ * Reason: DOM/querySelector is not available in all environments.
+ *
+ * We have to cast to any because utils can be consumed by a variety of environments,
+ * and we don't want to break TS users. If you know what element will be selected by
+ * `document.querySelector`, specify it as part of the generic call. For example,
+ * `const element = getDomElement<Element>('selector');`
  *
  * @param selector the selector string passed on to document.querySelector
  */
-export function getDomElement(selector: string): Element | null {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function getDomElement<E = any>(selector: string): E | null {
   const global = getGlobalObject<Window>();
   if (global.document && global.document.querySelector) {
-    return global.document.querySelector(selector);
+    return global.document.querySelector(selector) as unknown as E;
   }
   return null;
 }