Getting an error when trying to use setTimeout about angular-playground

[m0t0r]

Yeah, that works fine. Thanks a lot!

[jschwarty]

Can you post an example of your stats-widget.component.sandbox.ts?

[m0t0r]

Hi, @jschwarty, thanks for your reply. It's working fine now, I was doing something wrong.

Will leave a working example here as a reference:

context: {
      data: (function () {
        return new Promise(resolve => {
          setTimeout(() => resolve({
            value: 3150,
            title: 'Stats 1',
            description: 'Stats description 1'
          }), 1000);
        });
      })()
    },
template: '<app-stats-widget [data]="data | async"></app-stats-widget>'

but there is another problem. When I switch between sandbox cases using quick search it looks like all cases are already run so I have to refresh page to actually rerun and see the delay I need. Is it possible to run each sandbox case only when you navigate to it and rerun each time you open it again ? I can close this issue and open another one if required.

[jschwarty]

@m0t0r You can leave this one open. I will use what you posted to take a look at the issue you are experiencing and get you an answer on that. I might not be able to get to it today but I will get back to you soon on it.

[m0t0r]

@jschwarty that's fine, thanks a lot!

[m0t0r]

@jschwarty, do you have any updates ?

[jschwarty]

It's because you have an IIFE there, and the *.sandbox.ts file gets ran as soon as you choose any of the scenarios for that sandboxOf component. So that code is getting run once in that file when the sandboxOf function is called.

You could create an accessor so that it is called on execution of each component scenario run:

context: {
  get data() {
    return new Promise(resolve => {
      setTimeout(() => resolve({
        value: 3150,
        title: 'Stats 1',
        description: 'Stats description 1'
      }), 1000);
    });
  }
}