JavaScript¶

Кодовый стиль¶

• Пожалуйста, соблюдайте стиль отступов, продиктованный в файле .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