Ace: コードの変更に応じてブレークポイントを移動します。

作成日 2013年03月06日  ·  4コメント  ·  ソース: ajaxorg/ace

簡単に言うと、コードの変更に応じてブレークポイントが移動するのは素晴らしいことです。

詳細:ラインに対して持続するラインハンドルがあると便利です。 この機能は、編集エクスペリエンスのコアとなるようであり、ブレークポイントとエラーメッセージの両方をラインハンドルにバインドする必要があります。

最も参考になるコメント

解決策を見つけましたが、一度に1つのブレークポイントしか許可しないため、私の場合にのみ機能します。 多少の改善があれば、一般的なケースにも適合します。
エディターインスタンスでonchangeリスナーを使用し、イベントを発生させたアクションによって変更された行数を確認しました。 これらが複数ある場合は、1つ以上の行が追加または削除された場合に使用されます。 イベントのアクションパラメータは、私たちがどちらの場合であるかを理解するのに役立ちます。
ブレークポイントを移動する必要があるかどうかを確認するために、変更の開始行と終了行の間にあるかどうかを確認します。 それがこの範囲内にある場合、私は移動する必要があります。

コード(すばやく記述)は次のとおりです。

aceEditor.on("change", function (e) {
                var breakpointsArray = aceEditor.session.getBreakpoints();
                if(Object.keys(aceEditor.session.getBreakpoints()).length>0){
                    if(e.lines.length>1){
                        var breakpoint = parseInt(Object.keys(breakpointsArray)[0]);
                        var lines = e.lines.length -1;
                        var start = e.start.row;
                        var end = e.end.row;
                        if(e.action==='insert'){
                            console.log('new lines',breakpoint, start , end );
                            if(breakpoint>start ){
                                console.log('breakpoint forward');
                                aceEditor.session.clearBreakpoint(breakpoint);
                                aceEditor.session.setBreakpoint(breakpoint + lines);
                            }
                        } else if(e.action==='remove'){
                            console.log('removed lines',breakpoint, start , end);
                            if(breakpoint>start && breakpoint<end ){
                                console.log('breakpoint remove');
                                aceEditor.session.clearBreakpoint(breakpoint);
                            }
                            if(breakpoint>=end ){
                                console.log('breakpoint behind');
                                aceEditor.session.clearBreakpoint(breakpoint);
                                aceEditor.session.setBreakpoint(breakpoint - lines);
                            }
                        }
                    }
                }
            });

誰かを助けたことを願っています!

全てのコメント4件

cloud9では、変更リスナーを使用して、別の配列のブレークポイントを更新しましたhttps://github.com/ajaxorg/cloud9/blob/master/plugins-client/ext.debugger/breakpoints.js#L170

aceは文字列の配列を使用するため、行と同期したオブジェクトの完全な配列、またはedit_sessionでのfoldlineの処理と同様の範囲を使用する、行ハンドルを最適に実装する方法がわかりません。 トリッキーな部分は、分割またはマージされる行の処理です。これは、行の注釈のタイプが異なれば、必要な動作も異なるためです。

ブレークポイントのソリューションは、注釈に対してうまく機能すると思います。

トリッキーな部分は、分割またはマージされる行の処理です。これは、行の注釈のタイプが異なれば、異なる動作が必要になるためです。

うーん..私は1つの例を作ることはできません。 共有していただければ幸いです:)

解決策を見つけましたが、一度に1つのブレークポイントしか許可しないため、私の場合にのみ機能します。 多少の改善があれば、一般的なケースにも適合します。
エディターインスタンスでonchangeリスナーを使用し、イベントを発生させたアクションによって変更された行数を確認しました。 これらが複数ある場合は、1つ以上の行が追加または削除された場合に使用されます。 イベントのアクションパラメータは、私たちがどちらの場合であるかを理解するのに役立ちます。
ブレークポイントを移動する必要があるかどうかを確認するために、変更の開始行と終了行の間にあるかどうかを確認します。 それがこの範囲内にある場合、私は移動する必要があります。

コード(すばやく記述)は次のとおりです。

aceEditor.on("change", function (e) {
                var breakpointsArray = aceEditor.session.getBreakpoints();
                if(Object.keys(aceEditor.session.getBreakpoints()).length>0){
                    if(e.lines.length>1){
                        var breakpoint = parseInt(Object.keys(breakpointsArray)[0]);
                        var lines = e.lines.length -1;
                        var start = e.start.row;
                        var end = e.end.row;
                        if(e.action==='insert'){
                            console.log('new lines',breakpoint, start , end );
                            if(breakpoint>start ){
                                console.log('breakpoint forward');
                                aceEditor.session.clearBreakpoint(breakpoint);
                                aceEditor.session.setBreakpoint(breakpoint + lines);
                            }
                        } else if(e.action==='remove'){
                            console.log('removed lines',breakpoint, start , end);
                            if(breakpoint>start && breakpoint<end ){
                                console.log('breakpoint remove');
                                aceEditor.session.clearBreakpoint(breakpoint);
                            }
                            if(breakpoint>=end ){
                                console.log('breakpoint behind');
                                aceEditor.session.clearBreakpoint(breakpoint);
                                aceEditor.session.setBreakpoint(breakpoint - lines);
                            }
                        }
                    }
                }
            });

誰かを助けたことを願っています!

上記のalessandrocaprarelliのソリューションを変更して、複数のブレークポイントで機能するようにしました。他の人にも役立つ可能性があります。

editor.on("change", function (e) {
    if (e.lines.length > 1 && (e.action==='insert' || e.action==='remove')){
        const breakpointsArrayOld = editor.session.getBreakpoints();
        let breakpointsArrayNew = [];

        const amountOfLinesAffected = e.lines.length - 1;
        const startRow = e.start.row;
        const endRow = e.end.row;

        for (const key of Object.keys(breakpointsArrayOld)) {
            let breakpointRow = parseInt(key)

            if (e.action==='insert') {  // new lines
                if (breakpointRow > startRow ){
                    // breakpoint forward
                    breakpointsArrayNew[breakpointRow + amountOfLinesAffected] = "ace_breakpoint"
                }
                else {
                    // unaffected by insert
                    breakpointsArrayNew[breakpointRow] = "ace_breakpoint"
                }
            }
            else if (e.action==='remove') {  // removed lines
                if (breakpointRow > startRow && breakpointRow <= endRow ){
                    // breakpoint removed
                }
                else if (breakpointRow >= endRow ){
                    // breakpoint behind
                    breakpointsArrayNew[breakpointRow - amountOfLinesAffected] = "ace_breakpoint"
                }
                else {
                    // unaffected by remove
                    breakpointsArrayNew[breakpointRow] = "ace_breakpoint"
                }
            }
        }

        // remove all old breakpoints
        for (const key of Object.keys(breakpointsArrayOld)) {
            let breakpointRow = parseInt(key)
            editor.session.clearBreakpoint(breakpointRow);
        }

        // add all new breakpoints
        for (const key of Object.keys(breakpointsArrayNew)) {
            let breakpointRow = parseInt(key)
            editor.session.setBreakpoint(breakpointRow);
        }
    }
})
このページは役に立ちましたか?
0 / 5 - 0 評価