Фрагменты фрагментов Google Chrome: идентификатор '' уже объявлен

Я использую сниппеты Google Chrome (внутри Dev Tools) для разработки и тестирования JS.

При объявлении классов ES6 консоль выдает

Uncaught SyntaxError: идентификатор "Foo" уже объявлен в...

после первого запуска.

class Foo {
constructor(val) {
        this.bar = val;
    }
}

var f = new Foo('myVal');
console.log(f.bar); // prints 'myVal'

Я провел небольшое исследование и обнаружил, что обертывание кода в область блока с помощью {} поможет избежать этой проблемы.

Но когда я делаю это, хотя код работает без ошибок, Chrome не распознает никаких последующих правок, которые я могу внести в свой код.

Итак, если я изменил приведенный выше код на следующий:

{
    class Foo {
    constructor(val) {
            this.bar = val;
        }
    }
}

var f = new Foo('myVal');
console.log(f.bar); // prints 'myVal'

Пока все работает нормально.

Теперь я понимаю, что с моим классом возникла проблема, и меняю код на следующий:

{
    class Foo {
    constructor(val) {
            this.bar = 'MyHardcodedVal'; // Here is the changed code
        }
    }
}

var f = new Foo('myVal');
console.log(f.bar); // STILL prints 'myVal'

Как видите, изменения, которые я внес в свой класс, не вступают в силу.

Похоже, что Google Chrome поместил мой код в песочницу, недоступную для редактирования.

Способ заглянуть за кулисы и увидеть, что делает Google Chrome, — это ввести преднамеренную ошибку в код, а затем нажать на источник ошибки, который Chrome показывает в консоли. Там вы увидите, что код для класса все еще старый и не изменился вообще, а код, который был вне области действия блока, актуален.

Я всегда могу закрыть вкладку, в которой работаю, и снова открыть ее, но это нецелесообразно.

Что я делаю не так?

Есть ли разумный способ использовать сниппеты для таких тестов?

Надеюсь, это имеет смысл!