Стиль кода¶

• Пожалуйста, следуйте стилю отступов, указанному в файле .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 использует фреймворк jQuery для расширения возможностей интерфейса админки. В сочетании с этим особое внимание уделяется производительности JavaScript админки и минимизации общего размера медиафайла администратора.

Тесты JavaScript¶

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

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

$ npm install

...\> npm install

$ npm test

...\> npm test