The function that I'm providing to define my directive is never called. It used to work fine but suddenly stopped working and I have no idea why.

Here's my directive:

```
portalApp.directive('contactPanel', function () {
    console.log("NEVER SHOWN!");
    return {
        restrict: 'AE',
        replace: 'true',
        templateUrl: 'partials/account/contactPanel.html',
        scope: {
            contact: '=contact',
            primaryRoleName: '@',
            roleName: '@',
            primary: '=primary',
            locations: '=locations'
        },
        controller: function (userService, $rootScope, $scope) {
            ...snip...
        }
    };
});

```

and here an example of its use:

```
<contact-panel contact="user.account.contacts.billing" role-name="billing"
               locations="locations"></contact-panel>

```

Note that I'm using the correct casing, i.e. camel-case in JS and hyphenation in HTML.

The key clue is that the message that's logged in the second line (i.e. 'NEVER SHOWN!') never shows up in the console. If I log a message immediately before the directive declaration then that shows up, so this code is being executed by the interpreter, but the framework is just never using my declaration.

I'd love to have an answer obviously, but I'd also love to hear of some approaches to debug this kind of problem.