Watchers fired in the last x iterations

[PierrickLozach]

I am getting some angular errors when using the following code. The script seems to work but I would like to suppress these errors. Could you help me find out what is going on?

Controller:

'use strict';

angular.module('preSalesQuestionnaireApp')
  .controller('QuestionnaireCtrl', function ($scope, $http) {
    $http.get('app/questionnaire/schema.json').success(function(resschema) {
      console.log(resschema);
      $scope.schema = resschema;
    });


    $http.get('app/questionnaire/form.json').success(function(resform) {
      console.log(resform);
      $scope.form = resform;
    });

  $scope.model = {};
  });

questionnaire.html:

<form sf-schema="schema" sf-form="form" sf-model="model"></form>

form.json:

[
  "projectname",
  {
    "type": "help",
    "helpvalue": "<h1>Select the deal type<span class=\"label\">New</span></h1>"
  },
  {
    "key": "dealtype",
    "type": "radiobuttons",
    "title": "Deal Type",
    "notitle": true,
    "style": {
      "selected": "btn-success",
      "unselected": "btn-default"
    },
    "titleMap": [
      { "value": "OnPremise", "name": "OnPremise" },
      { "value": "CaaS", "name": "CaaS" }
    ]
  },
  {
    "type": "submit",
    "title": "Save"
  }
]

schema.json:

{
  "type": "object",
  "properties": {
    "projectname": { 
      "type": "string", 
        "minLength": 2, 
        "title": "Project Name",
      "description": "Customer Name or alias"
    },
    "dealtype": {
      "type": "string",
      "title": "Deal Type",
      "enum": ["OnPremise", "CaaS"]
    }
  }
}

Error:

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":{"type":"string","minLength":2,"title":"Project Name","description":"Customer Name or alias"},"ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":{"type":"string","title":"Deal Type","enum":["OnPremise","CaaS"]},"ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}]]
http://errors.angularjs.org/1.4.0/$rootScope/infdig?p0=10&p1=%5B%5B%7B%22ms…%2C%7B%22name%22%3A%22CaaS%22%2C%22value%22%3A%22CaaS%22%7D%5D%7D%7D%5D%5D
    at REGEX_STRING_REGEXP (angular.js:68)
    at Scope.$get.Scope.$digest (angular.js:15594)
    at Scope.$get.Scope.$apply (angular.js:15824)
    at done (angular.js:10263)
    at completeRequest (angular.js:10435)
    at XMLHttpRequest.requestLoaded (angular.js:10376)
Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":{"type":"string","minLength":2,"title":"Project Name","description":"Customer Name or alias"},"ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":{"type":"string","title":"Deal Type","enum":["OnPremise","CaaS"]},"ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}],[{"msg":"schemaForm.form[0]","newVal":{"title":"Project Name","description":"Customer Name or alias","schema":"<<already seen>>","ngModelOptions":{},"key":["projectname"],"type":"text"}},{"msg":"schemaForm.form[1]","newVal":{"title":"Deal Type","schema":"<<already seen>>","ngModelOptions":{},"key":["dealtype"],"type":"select","titleMap":[{"name":"OnPremise","value":"OnPremise"},{"name":"CaaS","value":"CaaS"}]}}]]
http://errors.angularjs.org/1.4.0/$rootScope/infdig?p0=10&p1=%5B%5B%7B%22ms…%2C%7B%22name%22%3A%22CaaS%22%2C%22value%22%3A%22CaaS%22%7D%5D%7D%7D%5D%5D
["projectname", Object, Object, Object]

[nikmartin]

I get these as well, and they grow exponentially as the size of the schema grows. If I start cutting down the schema, I reach a point that the errors go away, but it's a pretty small schema at that point, with maybe 20 properties at most.

[nicklasb]

Please add a gist or plunkr so it can be easily debugged.

[nikmartin]

I've moved on from trying to use this library, so I won't have anything to add, maybe the OP can

[nicklasb]

Oh, that is too bad. ASF is really going places now.
But at least my advise works on other projects as well. :-)

[manit815]

I am facing a similar issue. So, I am setting form values inside an ajax call. The form basically contains some drop downs which in turn are populated by a service created in angular. Plane javascript function has been written which takes some parameters and gets the relevant drop down values.

And then in my view I am utilising the schema form like this.

The values have been set on rootScope so don`t worry about the $root part in the tag.

Now, the sf-schema attribute gives me [$rootScope:infdig] error. I have tried removing it and it doesn`t give me the error.

If I keep it the ajax calls just die. I cannot give you a plnkr for it and I also cannot provide you the actual code as well. But see if you can help.

I also tried $rootScopeProvider.digestTtl(400) but it works some time and some time it doesn`t. And it has performance issues as well.

[nicklasb]

It is very difficult to find out what is the problem from descriptions like this.
I am sorry, but at least for me, a plunkr is necessary for me to gain the needed insight into the code.
Also, trying to recreate it often helps the user to solve the problem yourself.
It is also about how much effort I can be expected to put into an issue vs. that of the one asking.

That said, I would perhaps recommend you to chain the $http.get's, they may happen in any order as it is now, and perhaps that causes problems with the rest of your code, but I don't know.

[nicklasb]

With chaining i mean:

    $http.get('app/questionnaire/schema.json').success(function(resschema) {
      console.log(resschema);
      $scope.schema = resschema;
      $http.get('app/questionnaire/form.json').success(function(resform) {
          console.log(resform);
          $scope.form = resform;
        });
    });

[nikmartin]

@nicklasb do you have a working plunkr i can fork to recreate the issue for you? I don't have time to get all the dependencies pulled in to replicate the issue, but I do have a simple working test case

[nicklasb]

@nikmartin, no I don't actually, not with ASF.

However that is something that would be good for the project to have, feel free to create a baseline ASF plunkr, and we can use that to create an official one to use in cases like this.

[nicklasb]

Found this, not sure how relevant the source is, but you could just copy/paste from ASF.
http://plnkr.co/edit/7Oqxxl?p=info

[nikmartin]

This demonstrates the isse:
https://plnkr.co/edit/ayyGY7JRCZ9bijhEItr1?p=preview
after the form is displayed, check the console, and about 10 seconds later, thousands of exceptions will be thrown in the console

[nicklasb]

Well, that is a huge schema.
As this doesn't produce the error, your error is at some point between:

var agencySchema = {
  'id': 'https://app.nitropcr.com/api/schema/agency',
  '$schema': 'http://json-schema.org/draft-04/schema#',
  'title': 'NitroPCR Agency Schema',
  'type': 'object',
  'properties': {
    '_id': {
      'type': 'string'
    },
  }
};

.. and the full schema.
I would recommend a common binary search to find the offending schema parts.

(removed the ", 'object']" as that doesn't generate any form input in ASF)

[nikmartin]

ALso, feel free to add this plunker to the readme:

https://plnkr.co/edit/5F0Gu1?p=preview

It's a plunker of the demo that's in the readme.

[nikmartin]

I would recommend a common binary search to find the offending schema parts.

I'm not sure I understand. If the error is purely related to the size of the schema, then I'm not sure how to proceed, as the size of the schema is what it is. The schema itself is a valid json-schema (v4)

[nicklasb]

I am suggesting not that the size is the issue, but some construct within
it.
On 27 Apr 2016 16:45, "Nik Martin" [email protected] wrote:

I would recommend a common binary search to find the offending schema
parts.

I'm not sure I understand. If the error is purely related to the size of
the schema, then I'm not sure how to proceed, as the size of the schema is
what it is. The schema itself is a valid json-schema (v4)

—
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#433 (comment)

[nikmartin]

I was able to continue with my task by adding this to my app:

.config(['$rootScopeProvider',function ($rootScopeProvider) {  
    $rootScopeProvider.digestTtl(15);
  }])

So @PierrickI3, in your case, try:

angular.module('preSalesQuestionnaireApp')
.config(['$rootScopeProvider',function ($rootScopeProvider) {  
    $rootScopeProvider.digestTtl(15);
  }])
  .controller('QuestionnaireCtrl', function ($scope, $http) {

The default digestTtl is 10, and something is triggering this, so bumping it by 5 fixed it for me in my VERY LARGE schema. This probably isn't a permanent fix, but at least I can continue without so many errors. I don't understand all the ramifications of doing this, but here's the docs for it: https://docs.angularjs.org/api/ng/provider/$rootScopeProvider

[nicklasb]

@nikmartin, I just saw the plunkr, it looks great!

Ok. I would say that this is a difficult one. Obviously, loads of watchers are created when a huge schema like this is loaded, so it actually may be a permanent fix.
For one, because this is a very special use case, and that setting makes angular view those as unstable, which they might not be.
However, I created schemas with hundreds of fields recently when I tested converting schema.org into json-schema, and had no such problems, and I had some 10 megabyte schemas there. So I am guessing that something in that schema triggers watches to be created.

[nikmartin]

So I am guessing that something in that schema triggers watches to be created.

Yes, we use MOST of the features of json-schema v4, so there may be some edge cases that are tripping it. We use regex pattern: {} validation functions, in the form of format: {} properties, etc.

[nicklasb]

Hm. It seems to be a plain complexity issue. If I remove the regex patterns, the error doesn't happen during initialisation. However it happens later on, when I navigate the form instead.

[nicklasb]

I think that perhaps some others should take a look at this issue and decide if there is anything to do here, @davidlgj , perhaps.

[Anthropic]

@nikmartin @nicklasb there are way too many watchers in the current bootstrap decorator in the name of flexibility, with the Material repo I made a number of values like title a one-way bind and more than halved the number of watchers. I suspect the same changes need to occur in the bootstrap repo. Otherwise as soon as you set all those values you trigger the watchers. A bugfix issue needs to be added to the bootstrap decorator, it could be a breaking change for some use cases. But I think it would certainly help the situation.

[nicklasb]

Ok, good that there seems to be an explanation.
Well, I would think that WRT breaking, that would mean that people would in some way edit titles and for some reason expect that would continue to be supported? I cannot see any mentioning of support for that in the documentation. Breaking undocumented functionality is not breaking.
Wouldn't this maybe affect some others that have had strange performance issues?

[Anthropic]

The new alpha would be good to get some feedback on regarding the issues here. If it is still worthwhile documenting the work around then @nicklasb can certainly look at updating that :)

[Anthropic]

Updated to use the latest version
https://plnkr.co/edit/C9mM5feGGZ0N7povA84G?p=preview

[Anthropic]

I believe this is fixed in the latest updates (alphas) for the eventual 1.0.0 release.
We remove many watchers and replace them with one-time binding. The example plunker no longer has the issue even without the config value.
Please re-open if there are still issues in these versions.

ps. @nikmartin I added the plunker to the create issue template and will try to remember to add to documentation soon, cheers :)