• 3.2
  • 5.0
  • 6.1
  • Версия документации: 3.1

JavaScript

Хотя большая часть ядра Django написана на Python, приложения admin и gis содержат код JavaScript.

Пожалуйста, следуйте этим стандартам при написании кода JavaScript для добавления в Django.

Стиль кода

  • Пожалуйста, следуйте стилю отступов, указанному в файле .editorconfig Мы рекомендуем использовать текстовый редактор с поддержкой EditorConfig, чтобы избежать проблем с отступами и пробелами. Большинство файлов JavaScript используют 4 пробела для отступов, но есть некоторые исключения.

  • При именовании переменных используйте camelCase вместо underscore_case. Различные файлы JavaScript иногда используют разный стиль кода. Пожалуйста, старайтесь соответствовать стилю кода каждого файла.

  • Используйте ESLint для проверки кода на наличие ошибок и ошибок стиля. ESLint будет запущен при запуске тестов JavaScript. Мы также рекомендуем установить плагин ESLint в текстовом редакторе.

  • По возможности пишите код, который будет работать, даже если структура страницы будет позже изменена с помощью JavaScript. Например, при привязке обработчика щелчкоиспользуйте $('body').on('click', selector, func) вместо $(selector).click(func). Это упрощает для проектов расширение поведения Django по умолчанию с помощью JavaScript.

Патчи JavaScript

Django’s admin system leverages the jQuery framework to increase the capabilities of the admin interface. In conjunction, there is an emphasis on admin JavaScript performance and minimizing overall admin media file size. Serving compressed or «minified» versions of JavaScript files is considered best practice in this regard.

To that end, patches for JavaScript files should include both the original code for future development (e.g. foo.js), and a compressed version for production use (e.g. foo.min.js). Any links to the file in the codebase should point to the compressed version.

Compressing JavaScript

To simplify the process of providing optimized JavaScript code, Django includes a handy Python script which should be used to create a «minified» version. To run it:

$ python django/contrib/admin/bin/compress.py
...\> py django\contrib\admin\bin\compress.py

Behind the scenes, compress.py is a front-end for Google’s Closure Compiler which is written in Java. The Closure Compiler library is not bundled with Django, but will be installed automatically by npm. The Closure Compiler library requires Java 7 or higher.

Please don’t forget to run compress.py and include the diff of the minified scripts when submitting patches for Django’s JavaScript.

Тесты JavaScript

Django’s JavaScript tests can be run in a browser or from the command line. The tests are located in a top level js_tests directory.

Написание тестов

Тесты JavaScript Django используют QUnit. Вот пример тестового модуля:

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);
});

Please consult the QUnit documentation for information on the types of assertions supported by QUnit.

Запуск тестов

Тесты JavaScript можно запускать из веб-браузера или из командной строки.

Запуск тестов из веб-браузера

To run the tests from a web browser, open up js_tests/tests.html in your browser.

Чтобы измерить покрытие кода при запуске тестов, вам нужно просмотреть этот файл по HTTP. Чтобы просмотреть покрытие кода:

  • Выполните python -m http.server из корневого каталога (не изнутри js_tests).

  • Откройте http://localhost:8000/js_tests/tests.html в своем веб-браузере.

Тестирование из командной строки

Для запуска тестов из командной строки вам необходимо установить Node.js.

После установки Node.js установите зависимости теста JavaScript, выполнив следующее из корня вашего Django:

$ npm install
...\> npm install

Затем запустите тесты с помощью:

$ npm test
...\> npm test
Back to Top