JavaScript ¶

Стиль кода ¶

• Пожалуйста, соблюдайте стиль отступа, указанный в .editorconfig файле. Мы рекомендуем использовать текстовый редактор с поддержкой EditorConfig, чтобы избежать проблем с отступами и пробелами. В большинстве файлов JavaScript для отступа используется 4 пробела, но есть некоторые исключения.
• При именовании переменных используйте camelCaseвместо underscore_case. В разных файлах JavaScript иногда используется другой стиль кода. Пожалуйста, постарайтесь соответствовать стилю кода каждого файла.
• Используйте линтер кода ESLint, чтобы проверить свой код на наличие ошибок и ошибок стиля. ESLint будет запущен, когда вы запустите тесты JavaScript. Мы также рекомендуем установить плагин ESLint в ваш текстовый редактор.
• По возможности напишите код, который будет работать, даже если структура страницы позже будет изменена с помощью JavaScript. Например, при привязке обработчика кликов используйте вместо . Это упрощает проектам расширение поведения Django по умолчанию с помощью JavaScript.$('body').on('click', selector, func)$(selector).click(func)

Патчи JavaScript ¶

Система администрирования Django использует фреймворк jQuery для расширения возможностей интерфейса администратора. В сочетании с этим упор делается на производительность административного JavaScript и минимизирует общий размер административного медиа-файла.

Тесты JavaScript ¶

Тесты Django JavaScript можно запускать в браузере или из командной строки. Тесты расположены в 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