There seems to be an issue with the Angular zone.js and zone-evergreen.js files showing an error that reads:

My Angular 11 app suddenly started showing errors across all browsers and environments (local, staging, prod) about an hour ago without any updates:

Uncaught TypeError: t.getElementsByTagName is not a function
    at computeStackTrace.js:338
    at Array.forEach (<anonymous>)
    at computeStackTrace.js:338
    at Array.forEach (<anonymous>)
    at MutationObserver.<anonymous> (computeStackTrace.js:338)
    at l.invoke (polyfills.98c82c2662d9589ab04d.js:formatted:278)
    at a.runGuarded (polyfills.98c82c2662d9589ab04d.js:formatted:119)
    at MutationObserver.<anonymous> (polyfills.98c82c2662d9589ab04d.js:formatted:98)

The dependencies listed in our package.json are as follows:

    "dependencies": {
        //List of dependencies here
    },

We have tried multiple solutions to fix the issue, including upgrading locally to Angular 12, but nothing has solved it so far.

Has anyone encountered a similar problem before?

Answer №1

Success! It took us 2 hours, but we were able to identify the issue: an unexpected Hubspot (CRM) script was causing disruptions in our index.html file... (seems like it was messing up the HTML layout)

By removing the <script> tag, everything reverted back to its original state immediately... Remembering this experience for future reference in case someone encounters a similar obstacle someday!

Answer №2

HubSpot has confirmed that the problem has been resolved, as stated here:

This issue was affecting my project as well, and we last encountered it in production on December 1st, 2021 at 1:10pm EST.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Storing response data as a variable in TypeScript with Angular 2 can be achieved by declaring a variable

I am unfamiliar with TypeScript and need assistance. After performing a POST request, I received an _id that I now need to use to execute a PUT function for play pause. When the play pause button is clicked, the response should be sent to the server. Below ...

Is it possible to dynamically retrieve an element's style from @ViewChild in an Angular 2 component without needing an active approach?

For instance, there's an element in the template that uses a local variable #targetElement to retrieve its current width whenever needed. However, I prefer not to calculate the style programmatically. I attempted using a setter with the @ViewChild ann ...

A step-by-step guide on accessing the data from an uploaded JSON file in a React application

One exciting feature is the drag and drop component that allows users to add multiple files. However, there seems to be an issue with displaying the content of a JSON file once it's added. Below is the code snippet in question: if (files?.length) ...

Utilize the unique key generated by Firebase for assigning values to ng-select elements

Version of Angular: 8.2.12 My goal: I am looking to create a form where users can add a new product and choose packaging products for it from another collection. These packaging products may have changing attributes like price, so I aim to link them using ...

Removing spaces within brackets on dynamic properties for objects can be achieved by utilizing various methods such as

I've encountered an issue with my code that involves getting spaces within square brackets for the dynamic properties of an object. Even after searching through Code Style/Typescript/Spaces, I couldn't find any settings to adjust this. Could thes ...

What is the best way to organize objects based on their timestamps?

I am faced with the task of merging two arrays of objects into a single array based on their timestamps. One array contains exact second timestamps, while the other consists of hourly ranges. My goal is to incorporate the 'humidity' values from t ...

Steps for Properly Defining Next.js getServerSideProps as a Function Declaration

I've been working on implementing getServerSideProps (additional information available here, and detailed API documentation here), but my challenge lies in utilizing it as a function declaration instead of an expression. Despite searching for relevant ...

Utilize Angular 2 Form Elements Again

I'm currently in the process of working on a project with Angular and I want to make sure that my form components can be used for creating and updating entities seamlessly. Let's say I have a User entity stored on a remote API, and I have a form ...

Transmitting multiple parameters, including a file, from Angular to Spring framework

I am attempting to send an http request with multiple parameters to Spring. One of the parameters is a file, but I keep receiving a bad request error from the server. I am confident that I have made a mistake somewhere, and I would appreciate your assistan ...

Steps to successfully deploy an Angular application using Jenkins

I'm in the process of deploying my Angular application to an AWS EC2 instance. For version control, I'm utilizing Bitbucket and Jenkins for continuous integration. ...

What is the best way to access the data stored within a Promise object in a React application?

Below is the snippet of my code that handles parsing application data: async function parseApplication(data: Application) { const fieldGroupValues = {}; for (const group of Object.keys(data.mappedFieldGroupValues)) { const groupValue = data.mappedF ...

Problems encountered while building TypeScript on Azure's Hosted Agent

I'm currently working on an ASP.NET MVC application built in .Net5 that utilizes TypeScript files and includes NuGet package references for the following: <PackageReference Include="BuildBundlerMinifier" Version="3.2.449" /> ...

The command 'npm cache clean' is failing to work in the Angular environment when using Visual Studio Code as the integrated

npm ERROR! Starting from npm@5, the npm cache will automatically fix any corruption issues and ensure that data extracted from the cache is always valid. To verify consistency, you can use 'npm cache verify' instead. npm ERROR! npm ERROR! ...

How can I store unique and only selected checkbox values in an array using Angular?

I need assistance with creating an array from three checkboxes. The array should only contain the values of the checked checkboxes and should not include duplicates. I have attempted to achieve this functionality, but the values are still being added rega ...

The concept of Nested TypeScript Map Value Type

Similar to Nested Typescript Map Type, this case involves nesting on the "value" side. Typescript Playground const mapObjectObject: Map<string, string | Map<string, string>> = new Map(Object.entries({ "a": "b", &quo ...

Enforce a mandatory selection in a group of checkboxes depending on the input value in a

I have a new challenge with a form that includes a group of checkboxes and a textbox. I need to make the checkboxes mandatory based on the value entered in the textbox. I am looking for a way to declare the checkbox group similar to how I did it in the p ...

Discover the data type of the subfield within an interface or type in Typescript

Check out the interface and type declarations provided below: interface Foo { bar: { a: number b: string } } type Foo = { bar: { a: number b: string } } Is it possible to obtain the type definitions for "baz"? This will allow us ...

Wrapping an anonymous function in a wrapper function in Typescript can prevent the inferred typing

I am encountering an issue with typing while coding: function identity<T>(v: T): T{ return v; } function execute(fn: {(n: number):string}) {} execute((n) => { // type of n is 'number' return n.toFixed(); }) execute(identity(( ...

Is there a way to run a URL in Angular2 without having to include the ID like /edit/:id?

Looking to access a specific page in the browser? Instead of the longer URL below: You can use this shorter link to view or edit details for a specific ID in AngularJS 2. ...

Using the <head> or <script> tag within my custom AngularJS2 component in ng2

When I first initiate index.html in AngularJS2, the structure looks something like this: <!doctype html> <html> <head> <title>demo</title> <meta name="viewport" content="width=device-width, initial-scal ...