JavaScript

DjangoコアのほとんどはPythonですが、adminおよびgis contribアプリにはJavaScriptコードが含まれています。

Djangoに含めるJavaScriptコードを作成するときは、これらのコーディング標準に従ってください。

コードスタイル

.editorconfigファイルに記載されているインデントスタイルに準拠してください。インデントと空白の問題を回避するために、 EditorConfig をサポートするテキストエディターを使用することをお勧めします。ほとんどのJavaScriptファイルはインデントに4つのスペースを使用しますが、いくつかの例外があります。
変数に名前を付けるときは、underscore_caseの代わりにcamelCaseを使用してください。 JavaScriptファイルが異なれば、使用するコードスタイルも異なる場合があります。各ファイルのコードスタイルに準拠するようにしてください。
JSHint コードリンターを使用して、コードにバグやスタイルエラーがないか確認します。 JavaScriptテストを実行すると、JSHintが実行されます。また、テキストエディタにJSHintプラグインをインストールすることをお勧めします。
可能であれば、後でJavaScriptでページ構造が変更されても機能するコードを記述してください。たとえば、クリックハンドラーをバインドするときは、$(selector).click(func)の代わりに$('body').on('click', selector, func)を使用します。これにより、プロジェクトはJavaScriptを使用してDjangoのデフォルトの動作を簡単に拡張できます。

JavaScriptパッチ

Djangoの管理システムはjQueryフレームワークを活用して、管理インターフェースの機能を向上させます。併せて、管理JavaScriptのパフォーマンスと、全体的な管理メディアファイルサイズの最小化に重点が置かれています。 JavaScriptファイルの圧縮バージョンまたは「縮小」バージョンを提供することは、この点でのベストプラクティスと見なされます。

そのために、JavaScriptファイルのパッチには、将来の開発のために元のコードの両方を含める必要があります（例： foo.js）、および本番環境で使用するための圧縮バージョン（例： foo.min.js）。コードベース内のファイルへのリンクは、圧縮バージョンを指している必要があります。

JavaScriptの圧縮

最適化されたJavaScriptコードを提供するプロセスを簡素化するために、Djangoには「縮小」バージョンを作成するために使用する必要のある便利なPythonスクリプトが含まれています。それを実行するには：

舞台裏では、compress.pyは、Javaで記述されたGoogleのクロージャコンパイラのフロントエンドです。クロージャコンパイラライブラリはDjangoにバンドルされていませんが、上記のようにpipを使用してインストールできます。クロージャコンパイラライブラリには、 Java 7以降が必要です。

DjangoのJavaScriptのパッチを送信するときは、compress.pyを実行し、縮小されたスクリプトのdiffを含めることを忘れないでください。

JavaScriptテスト

DjangoのJavaScriptテストは、ブラウザーまたはコマンドラインから実行できます。テストは、最上位のjs_testsディレクトリにあります。

テストを書く

DjangoのJavaScriptテストは QUnit を使用します。テストモジュールの例を次に示します。

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

QUnit.test('removeOnClick removes button on click', function(assert) {
    var $ = 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) {
    var $ = django.jQuery;
    copyOnClick('.button');
    assert.equal($('.button').length, 1);
    $('.button').click();
    assert.equal($('.button').length, 2);
});

QUnit でサポートされているアサーションのタイプについては、QUnitのドキュメントを参照してください。

テストの実行

JavaScriptテストは、Webブラウザまたはコマンドラインから実行できます。

Webブラウザからのテスト

Webブラウザーからテストを実行するには、ブラウザーでjs_tests/tests.htmlを開きます。

テストの実行時にコードカバレッジを測定するには、HTTP経由でそのファイルを表示する必要があります。コードカバレッジを表示するには：

js_tests内からではなく、ルートディレクトリからpython -m http.serverを実行します。
Webブラウザで http：// localhost：8000 / js_tests / tests.html を開きます。

コマンドラインからのテスト

コマンドラインからテストを実行するには、 Node.js がインストールされている必要があります。

Node.js をインストールした後、Djangoチェックアウトのルートから以下を実行してJavaScriptテストの依存関係をインストールします。

次に、次のコマンドでテストを実行します。

JavaScript —Djangoドキュメント

目次