Código JavaScript

Si bien la mayoría del núcleo de Django es Python, las aplicaciones contribuyentes admin y gis contienen código JavaScript.

Por favor, sigue estos estándares de codificación al escribir código JavaScript para su inclusión en Django.

Convierte a un estilo de código

  • Por favor, ajusta tu indentación al estilo dictaminado en el archivo .editorconfig. Te recomendamos utilizar un editor de texto con soporte para EditorConfig para evitar problemas de indentación y espacios en blanco. La mayoría de los archivos JavaScript utilizan 4 espacios para la indentación, pero hay algunas excepciones.

  • Al nombrar variables, utiliza camelCase en lugar de underscore_case. Algunos archivos JavaScript utilizan diferentes estilos de código. Por favor, trata de ajustarte al estilo de cada archivo.

  • Utiliza el linter de código ESLint para verificar tu código por errores y problemas de estilo. ESLint se ejecutará cuando ejecutes los tests de JavaScript. También te recomendamos instalar un plugin de ESLint en tu editor de texto.

  • Donde sea posible, escribe código que funcione incluso si la estructura de la página cambia más tarde con JavaScript. Por ejemplo, al vincular un manejador de clic, utiliza $('body').on('click', selector, func) en lugar de $(selector).click(func). Esto facilita extender el comportamiento por defecto de Django con JavaScript.

Parches de JavaScript

El sistema administrativo de Django aprovecha la biblioteca jQuery para aumentar las capacidades de la interfaz administrativa. Concomitantemente, se enfatiza en el rendimiento y minimización del tamaño de los archivos multimedia administrativos.

Tests de JavaScript

Los tests de JavaScript de Django pueden ejecutarse en un navegador o desde la línea de comandos. Los tests están ubicados en una carpeta js_tests a nivel superior.

Escribir tests

Los tests de JavaScript de Django utilizan QUnit. Aquí tienes un ejemplo de módulo de prueba:

QUnit.module('magicTricks', {
    beforeEach: function() {
        const $ = django.jQuery;
        $('#qunit-fixture').append('<button class="button"></button>');
    }
});

QUnit.test('removeOnClick removes button on click', function(assert) {
    const $ = django.jQuery;
    removeOnClick('.button');
    assert.equal($('.button').length, 1);
    $('.button').click();
    assert.equal($('.button').length, 0);
});

QUnit.test('copyOnClick adds button on click', function(assert) {
    const $ = django.jQuery;
    copyOnClick('.button');
    assert.equal($('.button').length, 1);
    $('.button').click();
    assert.equal($('.button').length, 2);
});

Consulte la documentación de QUnit para obtener información sobre los tipos de declaraciones de aserción admitidas por QUnit.

Ejecutando pruebas

Los tests de JavaScript pueden ejecutarse desde un navegador web o desde la línea de comandos.

Pruebas desde un navegador web

Para ejecutar las pruebas desde un navegador web, abre el archivo js_tests/tests.html en tu navegador.

Para medir la cobertura del código cuando se ejecutan las pruebas, debes ver ese archivo sobre HTTP. Para ver la cobertura del código:

Pruebas desde la línea de comandos

Para correr los tests desde la línea de comandos, necesitas tener instalado Node.js.

Después de instalar Node.js, instala las dependencias de pruebas de JavaScript ejecutando lo siguiente desde la raíz de tu checkout de Django:

$ npm install

Luego, corre los tests con:

$ npm test
« previous | up | next »