Chromeブラウザで、JavaScriptのデバッグを、Elementの変化とブレイクポイントでの値の変化を同時に見たい

実現したいこと

その際、HTMLの要素のclassが変化することを、javascriptにブレークポイントを張ってステップ実行しつつ確認したい

発生している問題・エラーメッセージ

例えば「画面上のセレクトボックスで特定の選択肢を選ぶと、他の要素にclassを付与する」というjavascriptについて、
Chromeブラウザのデベロッパーモードでデバッグをする際、
画面のセレクトボックスを操作しつつ、Elementタブで、該当のHTML要素にclassが付与されるのを確認する
もしくは、
sourcesタブでhoge.jsを開き、セレクトボックスの変化によって発火するfunction内にブレークポイントを張って、処理の流れを確認する

が一般的だと思いますが、
この二つを１つのブラウザ内で同時に実行することは可能なのでしょうか？
javascriptをステップ実行しつつ、HTML要素が変化するのを目視したいです。

補足情報（FW/ツールのバージョンなど）

Chromeブラウザ