# UI node gets new md-card at every deploy

**URL:** <https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888>\
**Category:** Developing Nodes\
**Created:** [7 December 2019 20:06 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888 "2019-12-07T20:06:06Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [7 December 2019 20:06 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888/1 "2019-12-07T20:06:06Z")

</div>

Hi folks,

I'm developing a new UI node, but something weird is going on.  
Every time I deploy my flow, I get a **new md-card** for the group where my UI node belongs to.  
For example, this is the result after 3 successive deploys:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/7/7301ec960b5d5f25716f61b4c7fde363bfc1acc0.png)

I '_think_' I have't done anything special, compared to my other UI nodes 🥴  
So I also arrive 3 times in my `$scope.init` function ...  
And I don't see anything special in the browser console log.

Does anybody have a clue where I might start searching?

**[EDIT]** Node-RED version 1.0.2 and dashboard version 2.19.0.

Thanks!!!  
Bart

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [7 December 2019 21:20 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888/2 "2019-12-07T21:20:13Z")

</div>

For other nodes it's usually when you don't close the node properly or don't stop some listener you added - so on deploy the old one still remains. Not seen it with ui nodes so you are breaking new ground again 🙂

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [7 December 2019 21:22 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888/3 "2019-12-07T21:22:48Z")

</div>

> [@dceejay](#):
>
> Not seen it with ui nodes

Yes Dave,  
you are right. Normally I have to put some code for the "close" event, but haven't done that yet for UI nodes ... Will need to put the code part by part in comment, and hopefully I can find by elimination which part of my code is causing troubles ...

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [7 December 2019 22:44 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888/4 "2019-12-07T22:44:36Z")

</div>

> [@dceejay](#):
>
> it's usually when you don't close the node properly

Seems to be sooooooooooo true, even for UI nodes 🙄  
I had some client-side cleanup coding, so I have been so smart to add the _ **client-side** _ cleanup stuff to my _ **server-side** _ "_close_" event:

```auto
node.on("close", function() {
   $scope.recorderStatus = null;
            
   if ($scope.rafId) {
      // When streaming to the server is currently busy, we need to stop it
      cancelAnimationFrame($scope.rafId);
      $scope.rafId = null;
   }
            
   if ($scope.timerId) {
      // When a timer is currently busy, we need to stop it
      clearInterval($scope.timerId); 
      $scope.timerId = null;
   }
            
   if (done) {
      done();
   }
});

```

How stupid of me. Because now it fails to find the $scope variable on the server:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/a/a5e9fd1e814a782fcb7f9d75ae6d48d4d273e324.png)

And then the entire cleanup stuff seems to be messed up somehow ...  
So that mystery is solved. 👻  
But now I have two new questions:

1. I need to find out _ **where I have to put my cleanup code on the AngularJs client-side** _. Does anybody have a suggestion?

2. Now I see finally why no hints about the error were available in the log:

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [7 December 2019 23:04 UTC](https://discourse.nodered.org/t/ui-node-gets-new-md-card-at-every-deploy/18888/5 "2019-12-07T23:04:56Z")

</div>

> [@BartButenaers](#):
>
> need to find out _ **where I have to put my cleanup code on the AngularJs client-side** _ .

I'm not an AngularJs specialist, but I moved my **client side cleanup code** here:

```auto
initController: function($scope, events) {
   $scope.init = function (config) {
      ...                      
      $scope.$on('$destroy', function() {
         $scope.recorderStatus = null;
             if ($scope.rafId) {
                // When streaming to the server is currently busy, we need to stop it
                cancelAnimationFrame($scope.rafId);
                $scope.rafId = null;
             }
                                
             if ($scope.timerId) {
                // When a timer is currently busy, we need to stop it
                clearInterval($scope.timerId); 
                $scope.timerId = null;
             }
      })
   }
}

```

As soon as **deploy** my flow, I arrive in this function. So I think my issue is solved ...