Angular.js: angular-mock 1.5.1 TypeError: undefined no es un constructor (evaluando 'angular.element.cleanData (cleanUpNodes)')

Eso es extraño, ya que no se llama a ningún constructor en ese fragmento de código. ¿Quizás pueda proporcionar más información? Una copia de una prueba fallida, preferiblemente una que podamos ejecutar.

Aquí puede encontrar una prueba, no hace nada, pero todas las pruebas que tenemos fallan (solo para la versión 1.5.1, 1.5.0 está bien).
Test Runner Karma, Marco de pruebas Jasmine. Configuración del proyecto "Foundation for Apps"
https://github.com/HamburgOOU/hoou-webapp/blob/master/test/controllerTest/AboutControllerTest.js

Parece que estás usando ui-router, ¿verdad?
¿Puede intentar crear una prueba que se ejecute aquí: http://plnkr.co/edit/tpl : vojSWqpk1yBjQbbPeXRH?

Como sugerencia, también debe intentar eliminar las dependencias de su prueba y ver qué desencadena exactamente el error (tiene muchas dependencias en el módulo de la aplicación)

Sí, usando angular-ui-router (0.2.18).
Trommorow intentaré encontrar la dependencia que la causa.

+1, recibo un error muy similar al intentar probar un proveedor.

TypeError: 'undefined' no es una función (evaluando 'angular.element.cleanData (cleanUpNodes)')
en ../node_modules/angular-mocks/angular-mocks.js:2776
en ../node_modules/angular-mocks/angular-mocks.js:2746

Editar: Este error ocurre con la versión 1.5.1, cambié de nuevo a 1.5.0 y todo funciona nuevamente.

Viendo esto aquí: https://travis-ci.org/likeastore/ngDialog/builds/116420597

@petebacondarwin undefined is not a constructor es el error críptico que da PhantomJS cuando intenta llamar a una función que no está definida. Es equivalente al error a.something is not a function Chrome.

Recibimos un error similar en Angular / Mock 1.5.1, que no es un problema en 1.5.0:

# PhantomJS
TypeError: undefined is not a constructor (evaluating 'angular.element('<div ng-app></div>').data('$injector', $injector)') 
    in /bower_components/angular-mocks/angular-mocks.js (line 2102)
    /bower_components/angular-mocks/angular-mocks.js:2102:69
    invoke@/bower_components/angular/angular.js:4443:22
    /bower_components/angular/angular.js:4261:43
    getService@/bower_components/angular/angular.js:4402:46
    invoke@/bower_components/angular/angular.js:4434:23
    /bower_components/angular/angular.js:4261:43
    getService@/bower_components/angular/angular.js:4402:46
    invoke@/bower_components/angular/angular.js:4434:23
    /bower_components/angular/angular.js:4261:43
    getService@/bower_components/angular/angular.js:4402:46
    invoke@/bower_components/angular/angular.js:4434:23
    /bower_components/angular/angular.js:4265:85
    forEach@/bower_components/angular/angular.js:336:24
    createInjector@/bower_components/angular/angular.js:4265:10
    workFn@/bower_components/angular-mocks/angular-mocks.js:2922:60

# Chrome
TypeError: angular.element(...).data is not a function
        at $get (/bower_components/angular-mocks/angular-mocks.js:2102:65)
        at Object.invoke (/bower_components/angular/angular.js:4443:17)
        at /bower_components/angular/angular.js:4261:37
        at getService (/bower_components/angular/angular.js:4402:39)
        at Object.invoke (/bower_components/angular/angular.js:4434:13)
        at /bower_components/angular/angular.js:4261:37
        at getService (/bower_components/angular/angular.js:4402:39)
        at Object.invoke (/bower_components/angular/angular.js:4434:13)
        at /bower_components/angular/angular.js:4261:37
        at getService (/bower_components/angular/angular.js:4402:39)

Tenga en cuenta que usamos jQuery junto con Angular.

¿Podría esto estar relacionado con https://github.com/angular/angular.js/commit/75373dd4bdae6c6035272942c69444c386f824cd?

@nikrolls

angular.element (...). data no es una función

¿Entiendo bien que angular.element(...) (que tiene un alias de jQuery(...) si carga jQuery antes de Angular) devuelve algo que no tiene el método data ? Eso parece raro. ¿Podría habilitar "interrumpir los rechazos" en Chrome DevTools y luego, cuando llegue a esta línea, verifique qué devuelven exactamente las siguientes expresiones:

1. angular.element
2. angular.element(...) (sustituye los puntos con lo que realmente tienes allí)
3. ... (sustituya los puntos con lo que tenía en angular.element )

¡Gracias!

Tenemos un problema similar desde angular v1.5.1.

should update data with success with redirect
          PhantomJS 2.1.1 (Linux 0.0.0)
        TypeError: undefined is not an object (evaluating '$location.path(interpolate(nextRoute.redirectTo, nextRoute.params)).search') in /project/app/bower_components/angular-route/angular-route.js (line 601)
        commitRoute@/project/app/bower_components/angular-route/angular-route.js:601:82
        $broadcast@/project/app/bower_components/angular/angular.js:17207:33
        afterLocationChange@/project/app/bower_components/angular/angular.js:13127:28
        /project/app/bower_components/angular/angular.js:13113:32
        $eval@/project/app/bower_components/angular/angular.js:16884:28
        $digest@/project/app/bower_components/angular/angular.js:16700:36
        flush@/project/app/bower_components/angular-mocks/angular-mocks.js:1779:45
        /project/app/modules/main/partners/partners.spec.js:338:31
        invoke@/project/app/bower_components/angular/angular.js:4625:24
        workFn@/project/app/bower_components/angular-mocks/angular-mocks.js:2933:26
        Error: [$rootScope:inprog] $digest already in progress
        http://errors.angularjs.org/1.5.1/$rootScope/inprog?p0=%24digest (line 17242)
        beginPhase@/project/app/bower_components/angular/angular.js:17242:88
        $digest@/project/app/bower_components/angular/angular.js:16680:19
        flush@/project/app/bower_components/angular-mocks/angular-mocks.js:1779:45
        /project/app/modules/main/partners/partners.spec.js:385:39
        invoke@/project/app/bower_components/angular/angular.js:4625:24
        workFn@/project/app/bower_components/angular-mocks/angular-mocks.js:2933:26
        inject@/project/app/bower_components/angular-mocks/angular-mocks.js:2902:46
        /project/app/modules/main/partners/partners.spec.js:381:23
        undefined

En este caso, el error siempre se produce cuando las pruebas incluyen la función inject() . Supongo que la función spyOn($location, 'path'); en la función beforeEach podría ser el problema.

describe('ctrl test', function () {
    beforeEach(inject(function ($controller, $location) {
        spyOn($location, 'path');
    }));

    describe('save()', function () {
        it('should work', function(){
            inject(function ($location) {
                // some test code
            });
        });
    });
});

@ 4kochi : tu problema es que en realidad has espiado una función pero no has proporcionado una implementación para el espía. En otras palabras, llamar a spyOn($location, path); anula el método $location.path con una función de espionaje, pero esa función de espionaje devuelve undefined . Más tarde, el enrutador está tratando de acceder a $location.path().search , que efectivamente dice undefined.search .

Debe proporcionar una implementación para el espía: una falsificación o una transferencia:

spyOn($location, 'path').andCallThrough();
spyOn($location, 'path').andCallFake(function(url) { return {...}; });

Gracias por el consejo @petebacondarwin Tuve una idea similar. Pero me pregunto entonces ¿por qué exactamente el mismo código de prueba funciona con Angular 1.5.0? ¿Me he perdido algo?

Tengo el mismo problema cuando uso inject , por ejemplo

  beforeEach(inject(function($rootScope) {

  }));

@ dagda1 , ¿podría proporcionar la información mencionada en https://github.com/angular/angular.js/issues/14251#issuecomment -198276079 (así como el seguimiento de pila exacto del error)?

También estaba viendo este problema con nuestras pruebas después de intentar actualizar a v1.5.2. Cambiando la línea 2776 de angular-mocks.js de:
angular.element.cleanData(cleanUpNodes);
A:
if (angular.element.cleanData) angular.element.cleanData(cleanUpNodes);

Solucione el problema. En nuestro caso, estamos tratando de espiar angular.element por varias razones.

En nuestro caso, estamos tratando de espiar angular.element por varias razones.

Eso explica el error.

angular.element es una "característica" bastante básica y de la que se depende en gran medida internamente. No recomendaría apagarlo. (Espiarlo y dejar que las cosas pasen debería estar bien).

Por cierto, cambiar el código a if (angular.element.cleanData) angular.element.cleanData(cleanUpNodes); conduce a pérdidas de memoria que pueden hacer que el karma se bloquee en grandes conjuntos de pruebas.
(Sí, ya pasó: smiley :)

Gracias @gkalpak . Desafortunadamente, cualquier tipo de espía (incluso uno que solo llama) parece causar el mismo problema. ¿Hay alguna otra solución en proceso u otras sugerencias para probar?

@KeithPepin angular.element es una bestia engañosa . ¿Realmente necesitas espiarlo? ¿Puede dar un ejemplo de sus pruebas?

Tengo el mismo problema.
obtener algún mensaje de error:

PhantomJS 2.1.1 (Linux 0.0.0) 首页单元测试 首页内容控制器测试 调用获取数据接口 encountered a declaration exception FAILED
    ReferenceError: Can't find variable: module in /client/modules/bootstrap/test/bootstrap.spec.js (line 4)
    /client/modules/bootstrap/test/bootstrap.spec.js:4:23
    global code@/client/modules/bootstrap/test/bootstrap.spec.js:3:9
PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.041 secs / 0.001 secs)

mi prueba de la siguiente manera:

describe( '首页模块单元测试', function(){

    var $httpBackend,
        $indexFactory;

    beforeEach( module( 'Datatao.bootstrap' ) ); 

    beforeEach( inject( function( _$httpBackend_,  _IndexFactory_ ){ 
        $httpBackend    = _$httpBackend_;
        $indexFactory   = _IndexFactory_;
    }) ); 

    describe( '首页内容控制器测试', function(){
        it( '调用获取数据接口', function(){
            expect( true ).toBe( true ); 
        });
    });

});

y uso angular 1.4.8 y ui-router 0.2.15 angular-mocks 1.5.2, pero después de degradar angular-mocks a 1.5.0, todo está bien.
si necesita más información, por favor @me

@terminatorheart No

He intentado recrear este problema aquí https://github.com/petebacondarwin/issue-14251
Pero karma start funciona bien para mí. ¿Puede sugerir qué más se necesita en el proyecto para que falle?

Recibo errores similares al pasar de 1.5.0 a 1.5.1.

tenemos el siguiente código para hacer un trabajo adicional antes de que la aplicación se inicie. ahora está fallando con el siguiente error.

var injMods = ['ng', 'tcpInitModule', 'mpyInitModule'];
var initInjector = angular.injector (injMods);

var tcpMembershipSvc = initInjector.get ('tcpMembershipSvc');
// trabaje un poco con el proveedor tcpMembershipSvc

// finalmente arranca
angular.bootstrap (documento, ['tcpMainModule']);

Error:
Error no detectado: [$ injector: unpr ] Proveedor desconocido: $ rootElementProvider <- $ rootElement <- $ ubicación <- $ ruta <- $ ubicación
http://errors.angularjs.org/1.5.1/ $ injector / unpr? p0 =% 24rootElementProvider%…% 24rootElement% 20% 3C-% 20% 24location% 20% 3C-% 20% 24route% 20% 3C- % 20% 24ubicación

En las pruebas unitarias falla con el siguiente error.
Error: [$ injector: moduler ] No se pudo crear una instancia del módulo ng debido a:
TypeError: 'undefined' no es un objeto (evaluando 'Function.prototype.bind.apply')
en la instanciación (c: /app/internal_packages/angular/angular.js: 4640)

@mlakmal, ¿ podría crear una demostración ejecutable de su problema que podamos probar?

@petebacondarwin he agregado el plnker a continuación.

https://plnkr.co/edit/J32cQo4Fo9fkiRH3pF3L?p=preview

También noté que el error de prueba unitaria también aparece en v1.5.0 ...

@mlakmal Creo que el problema en el plnkr es diferente del problema de la prueba unitaria. Probablemente tenga algo que ver con cambios en ngRoute.

El problema de la prueba unitaria parece deberse a que Function.prototype.bind no está definido. ¿Está utilizando PhantomJS 1.x?

Su otro problema está (más o menos) relacionado con el cambio ngRoute (5e37b2a); en realidad, está exponiendo un problema que ya está presente.

Una reproducción mínima es: angular.injector(['ng', 'ngRoute'])
Otra reproducción mínima (que no involucra ngRoute ) sería: angular.injector(['ng']).get('$location');

El problema es que el servicio $location depende de $rootElement . Angular no proporciona el $rootElement hasta que se inicia una aplicación (porque no se conoce antes de eso). Al intentar crear $location instancia de $rootElement y fallará, porque en ese momento no hay un proveedor para $rootElement .

TBH, no puedo pensar en una razón para cargar ngRoute desde un inyector personalizado ( @mlakmal Me interesaría mucho saber más detalles sobre su caso de uso, incluso si solo OOC: smiley :).

Una solución simple es incluir un módulo adicional ficticio que proporcione un $rootElement :

angular.module('fakeRootElement', []).value('$rootElement', angular.element('<div></div>'));
var initInjector = angular.injector(['ng', 'InitModule', 'fakeRootElement']);

Plnkr actualizado

Ahora, en el problema real, $location usa $rootElement para interceptar todos los eventos click y manejarlos en modo HTML5. Podríamos hacer de esto una dependencia "opcional" (por ejemplo, inyectar $rootElement solo si está definido o proporcionar un $rootElement ficticio y reemplazarlo durante el arranque).
La pregunta es ¿deberíamos?

Hola @gkalpak , tienes razón, estamos usando Phantom JS 1.9.8 y estamos tratando de pasar a la v2, pero se está retrasando por nuestro lado debido a los cambios de versión de nodo requeridos en los agentes de compilación (todavía estamos en el nodo v0.12.x) . Actualicé localmente PhantomJS a v2 y mis pruebas unitarias se ven bien. ¿Alguna idea de cómo solucionar el problema de PhantomJS 1?

Su solución alternativa funcionó muy bien para solucionar el problema en el inyector. Puedo vivir con esa solución hasta que nos mudemos a AngularJS 2 en el futuro (soñando ...).

Con respecto a nuestro caso de uso para ngRoute: tenemos algunos servicios que usan proveedores de ngRoute en CommonModule e InitModule. así que tuvimos que agregar ngRoute como dependencia del módulo para esos módulos mientras creábamos para admitir ejecuciones de prueba unitaria. Creo que podemos eliminarlo de esas dependencias y agregar ngRoute solo cuando sea requerido por la prueba unitaria.

Los problemas de prueba de unidad PhantomJS 1 se resolvieron después de agregar el siguiente polyfill para karma conf. No estoy seguro de por qué este error se produjo repentinamente después de la actualización angular 1.5.x ...

https://www.npmjs.com/package/phantomjs-polyfill

@mlakmal , la razón por la que este problema con PhantomJS no apareció antes, es que Angular no usó Function.prototype.bind . Lo hacemos ahora, ya que es necesario para admitir clases nativas y todos los navegadores compatibles lo proporcionan. (Tenga en cuenta que PhantomJS no se admite explícitamente, lo que significa que no lo probamos, pero mucha gente lo usa (incluido el proyecto ngMaterial hasta hace algún tiempo) sin problemas afaik).

Con respecto a confiar en ngRoute en InitModule :
ngRoute solo proporciona un proveedor ( $routeProvider ), que es útil solo para registrar rutas. Todavía no entiendo por qué necesita crear su propio inyector incluyéndolo (considerando que cada inyector creará una instancia diferente del servicio; los servicios son singletons con cada inyector).
Si está cargando InitModule solo para poder obtener algunos servicios de ayuda, entonces podría ser una mejor idea extraer estos servicios de ayuda en un módulo independiente (del cual InitModule depende) y luego solo cargue ese módulo auxiliar en su inyector adicional.

@gkalpak estamos usando $ routeParams de ngRoute en nuestras directivas. por eso lo agregamos a algunos de los módulos ... pero supongo que podemos agregar el módulo ngRoute a nuestros archivos de especificaciones por separado.

@mlakmal , mi punto fue que no puedo ver cómo ngRoute es necesario en su inyector adicional que crea manualmente (usando angular.injector([...]) ), ya que sería un inyector separado (con servicio separado instancias) desde el inyector de su aplicación.

Hola chicos, lamento volver a hablar de esto después de un par de días, pero acabo de encontrar esto.

Estoy espiando angular.element con todas las llamadas, pero todavía no funciona, desafortunadamente.

spyOn( angular, 'element' ).andCallThrough();

¿Alguna idea?

@mattgrande Creo que no podemos hacer mucho sin una demostración. ;)

Esto no es un problema con Jasmine 2.x por cierto, porque copia todas las propiedades de la función espiada en el espía (ver demostración ).

Sigue siendo un problema con Jasmine 1.x, que no copia propiedades (ver demostración ).
Puede solucionar esto copiando las propiedades usted mismo (todas o solo las necesarias, por ejemplo, cleanData ):

spyOn(angular, 'element').andCallThrough();

// Copy all properties
angular.extend(angular.element, angular.element.originalValue);
// or
// Copy `cleanData` only
angular.element.cleanData = angular.element.originalValue.cleanData;

TBH, me inclino a cerrarlo como works as expected / won't fix . angular.element() es demasiado fundamental y si alguien lo está espiando, es mejor que esté preparado para los BC (o use Jasmine 2: stick_out_tongue :)

También sería fácil solucionar esto dentro de ngMock , por ejemplo, cambiar angular.element.cleanData(...) a algo como:

var ngEl = angular.element;
(ngEl.cleanData || (ngEl.originalValue && ngEl.originalValue.cleanData) || angular.noop)(...)

Pero mañana podría haber otra biblioteca de pruebas que se rompa.

Entonces, desde:

(a) es solo un problema con Jasmine 1.x (no 2.x),
(b) solo rompe las pruebas, no el código de la aplicación y
(c) es tan fácil de arreglar,

(Todavía) me inclino por no "arreglar" esto.

@gkalpak Me inclino a estar de acuerdo contigo. Este es otro caso para la "página de problemas conocidos", ¿no?

usó la solución @KeithPepin ,

si (angular.element.cleanData)
angular.element.cleanData (cleanUpNodes);

trabajó para mi

Gracias por esto chicos. Intentaré actualizar a Jasmine 2.x (no hay _demasiados_ cambios), pero si eso resulta ser demasiado molesto, usaré la solución de Keith.

Actualización: Resulta que ya estaba en Jasmine 2.1, pero actualicé a la última y no afectó nada.

Terminé usando el método "extender" de

@mattgrande , ¿a qué versión de jazmín se actualizó? Es extraño que no haya funcionado, porque parece funcionar bien en mi demo con jasmine v2.4.1: confuso:

mismos errores con angular-simulacros 1.5.2 y 1.5.3
(Jazmín 2.4.1)

Jazmín 2.4.0; Versión angular 1.5.2

Hola, también tengo problemas indefinidos con PhantomJS2, karma y jazmín. Estoy usando las últimas versiones de karma y jazmín. Mi aplicación también usa ngRoute.

Mi problema surge cuando intento inyectar $ rootScope y $ controller. Estoy usando ngMock para simular uno de mis módulos. El alcance y el controlador siempre están indefinidos. Sin embargo, cuando pruebo solo el módulo usando angular.module, las pruebas pasan. No estoy usando spyOn.

¿Alguna sugerencia sobre cuál podría ser el error?

También tengo este problema al actualizar de 1.4.6 a 1.5.3.

¿Puede alguno de ustedes proporcionar una demostración ejecutable del problema?

@petebacondarwin aquí está la compilación fallida de travis: https://travis-ci.org/prestonvanloon/newrelic-angular/builds/118604417

Editar: aquí está el PR que lo causó https://github.com/prestonvanloon/newrelic-angular/pull/28

@prestonvanloon , su problema es que está utilizando diferentes versiones de angulares y
Siempre debes usar versiones coincidentes.

@gkalpak ¡ gracias!

@prestonvanloon : Verifique la versión de angulares y

Gracias @ varun85jobs y @gkalpak , ese era exactamente mi problema

Hola chicos, tengo un proyecto Ionic con la versión angular 1.5.3 y angular-mocks 1.5.3, pero sigo recibiendo el mismo error. ¿Qué podría ser?

Hola, mismo problema aquí, acabo de probar con 1.5.5 y 1.5.3 y todavía tengo problemas, como solución temporal usamos 1.5.0.

La respuesta de KeithPepin me lo solucionó, pero prefiero no cambiar el código de una biblioteca

Todavía no tenemos un caso de uso adecuado para espiar angular.element . Sin esto, no podemos seguir adelante con una solución.

Hay una pregunta sobre este tema aquí también.
Mi respuesta desde allí, en caso de que ayude a alguien aquí:

Tuve el mismo problema y lo que me solucionó fue cargar jquery en mis pruebas:

files: [
      'bower_components/jquery/dist/jquery.js',
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
...
]

tomó la idea de este comentario porque también usamos jQuery junto con Angular.

Todavía necesitamos una reproducción en ejecución real, donde todas las versiones de los módulos angulares utilizados coincidan.

Tengo este problema: angular.element.parent no es una función

@ kristoff2016 , este no parece el mismo problema. Abra una nueva edición, proporcionando más información, por ejemplo, el código relevante, el mensaje de error exacto, su entorno (navegador, sistema operativo, etc.). Las reproducciones en vivo (usando CodePen, Plnkr, etc.) también son muy apreciadas: grin:

En mi caso, el problema era que estaba usando una versión antigua de karma-phantomjs-launcher (^ 0.1.4 en lugar de ^ 1.0.0) que se basaba en una versión anterior de PhantomJS. Con [email protected] , está funcionando correctamente.

+1 actualizar karma-phantomjs-launcher y phantomjs a 2+ funcionó

La única opción que funcionó para mí hasta ahora fue degradar a angular / angular-mocks 1.5.0

¡Han pasado meses desde que se informó por primera vez y todavía no hay una reproducción real (con versiones coincidentes) publicada aquí! No podemos arreglar lo que no podemos ver. :preocupado:

Voy a cerrar esto, pero me encantaría volver a abrirlo si obtenemos una reproducción.

Hola @gkalpak , gracias por malo en nuestro código: see_no_ plnkr . Por lo tanto, es posible que el siguiente código no tenga mucho sentido para usted, pero lo hicimos como una solución para una situación muy específica:

var elSelect = angular.element;
angular.element = function(id) {
        try {
            return elSelect.call(angular, id);
        } catch(err) {
            return $(id);
        }
    };

Entonces, esto funciona para la versión 1.5.0 de angulares y simulaciones angulares cuando se prueba, pero no para 1.5.1-1.5.7 . No sé si es este caso específico o si otros casos usando angular.element también podrían romperse.

Gracias @vitorarins. Como se mencionó anteriormente, es una cosa muy "traviesa" sobrescribir un componente certal como angular.element y no al menos preservar sus propiedades. Sin embargo, usando la técnica angular.extend() descrita anteriormente, sería bueno.

var ngElement = angular.element;
angular.element = angular.extend(function(id) {
  try {
    return ngElement.call(angular, id);
  } catch(err) {
    return $(id);
  }
}, ngElement);

Plnkr actualizado

¡Muchas gracias @gkalpak! Espero que al menos esto sirva de referencia para otras personas que tengan este problema. De nuevo gracias mucho!

Hola, también estoy enfrentando el mismo problema. Pero usando selección angular. En mi controlador estoy inicializando seleccionar así.
angular.element ('seleccionar'). select2 ();

Agregado espía de la siguiente manera:
var ngElement = angular.element ('seleccionar');
angular.element = angular.extend (función (id) {
intentar {
return ngElement.call (angular, id);
} atrapar (err) {
return $ (id);
}
}, ngElement);

spyOn (ngElement, 'select2'). y.callFake (function () {

    });

ERROR de PhantomJS 2.1.1 (Mac OS X 0.0.0)
TypeError: se intentó asignar a la propiedad de solo lectura.
en /node_modules/angular/angular.min.js:9

Había revisado esta publicación por completo y usé angular 1.5.7 y jazmín 2.4.1. Pero todavía el problema no está resuelto.

@lathaMaramganti No es:

var ngElement = angular.element('select');

pero:

var ngElement = angular.element;

Necesita guardar la función original para extenderla, no su invocación.