Press "Enter" to skip to content

TDD with Wallaby.js Part 1


сегодня мы собираемся взглянуть на
wallaby j / s, который является тестирующим
постоянно проводит ваши тесты
внутри вашего редактора при вводе
Я mpj, и вы моете Fonfon
функция
[Музыка]
[Музыка]
[Музыка]
все в порядке, если вы являетесь постоянным зрителем
этого шоу вы знаете, что я НЕ
большой поклонник слишком много инструментов Я немного
минималистский инструментарий, я даже сделал видео
на том, что вам не нужно смотреть, что
но в основном суть в том, что я
как правило, отвлекаются на инструменты, а я
чувствую, что чем больше инструментов я использую, тем больше
мета-работа. Я, как правило , управляю всеми своими
инструментов поэтому поэтому я использую очень мало
плагины Я пытаюсь использовать как можно меньше библиотек
возможно, когда я создаю проект, а не
против инструментов Я просто думаю, что каждый
инструмент имеет немного наших затрат на обслуживание
который приходит с ним, поэтому вам нужно быть
скептически и действительно спрашивать себя :
этот инструмент, предоставляющий мне много
перед тем, как ввести его в свой
процесс, о, мой бог, извините за беспорядок
строительства студии, нарисованной этой площадью
вот это цвет, который
должно быть, в конце концов, как зеленый
уходит не этот зеленый , как это
экран в конечном итоге также сократится
это будет некоторое прохладное освещение
здесь мы увидим, как это может быть после
в эти выходные мы увидим, что я не использую
много плагинов редактора, но тот, который я делаю
использование quokka kwaka довольно круто
когда люди видят это, они, как правило, спрашивают
мне, что это такое
и похоже, что я печатаю что-то
и он в строке оценивает это так, если я
измените этот номер, он переоценит соус-i
время это в значительной степени это очень
очень полезно при попытке выяснить или
когда вы делаете видеоролики о
для YouTube, поэтому крокка
был с забавной функцией забавной для довольно
в то время как люди, делающие квоку
также делает более продвинутую вещь, называемую
wallaby, который является
потянулся к стене и спросил, если
они были готовы спонсировать эпизод
шоу, где я показываю Wallaby
JSON забавная функция, и они были
поэтому здесь я собираюсь показать вам
как это работает Я собираюсь построить простой
калькулятор или что-то создать реактивное приложение
super calc Я любил смотреть индикатор прогресса
это готово в порядке, сумасшедший суперкар kalloch
хм, и мы открываем порочный, чтобы быть coud
вы знаете, что давайте сначала убедиться , что
он работает, зависает на NPM, начинайте все правильно
прохладно реагировать, это работает, мы не даем
избавиться от этого немного, но и пойти
вернуться в код
ладно, давайте посмотрим, что у нас все в порядке, мы
есть некоторые тесты здесь или хорошо один тест
давайте попробуем, чтобы это хорошо работает
wallaby um см. здесь установить расширения
и затем мы используем проверку wallaby yes, что
мы просто интегрировали непрерывную интеграцию
необходимо установить, нажмите « ОК», затем перезагрузите
редактор ok обновляется оценка Wallaby Jaya
бла-бла-бла-бла в успешном
я действительно люблю, насколько легко это
установить плагины визуального кода студии
действительно показывает, что люди, которые их используют
или мазохисты, и я абсолютно не имею в виду
оскорбление мазохистов, заявив, что
во всяком случае, это еще не работает
давайте вернемся к Wallaby, что будет хорошо
выберите wallaby j / s
конфигурационный файл, поэтому voila B должен
иметь конфигурационный файл в
проект, потому что Wallaby может работать
как безумное количество разных
тестирование настроек очень гибкое, что
он должен знать, как
проект должен сказать, что вы это делаете
что будет джазовым преступником, так что давайте
узнайте , как работает браузер Wallaby
настроить файл продолжительности записи, и я думаю
что это должно быть 1 для создания реакции
app Я не могу себе представить, не boo boo boo boo
что это эта вещь не Нету
Я возьму этот один файл конфигурации
поддерживать технологии, что об этом
реагирует, если вы используете создание
реактивный инструмент bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla
Отличная копия, создадим
стены, мы вставим это в создание стены
[Музыка]
bj s конфигурационный файл не в источнике I
хочу, чтобы он был в корне, куда мы идем, и теперь
Я могу выбрать в Wallaby файл конфигурации расслоение плотной
не может найти файл, содержащий wallaby
в его названии, возможно, это должно быть
строчная давайте попробуем , что снова хорошо мы
start select yes boom okay закрытие, что
он работает мм не совсем еще SRC-тестер
J s, что мы начинаем, да, хорошо, повесьте трубку
давайте отлаживаем это, я собираюсь это сделать
нет, о, это работает, мы не поймали, что я
там я попал в игру действительно очень тяжело
второй раз, и все получилось так хорошо
мы собираемся сделать некоторые TDD здесь, мы
останемся в редакторе, мы не
собираюсь прыгать в браузер, пока
позже мы просто собираемся использовать тест для
стимулируем наше развитие, давайте начнем
написав наш первый первый тест или второй
потому что там уже нет
сбой тест, но um хорошо сделаем
добавление и
Мне очень нравится фермент, который является тестированием
инструмент для реагирования приложений от Airbnb
Я думаю, что вы так потянете
в настоящее время в Порт и десять центов, а затем мы
хотите неглубокую функцию для мелкой
рендеринг, давайте немного поговорим о
то , что находится на втором экзамене , и мы также
необходимо установить фермент, создать интегрированный
терминал MPM установить фермент о да это
такой хороший индикатор прогресса сделан правильно
закрытие терминала, и мы делаем это
обертки, а затем мы делаем мелкие и делаем
приложение вроде этого нормально фермент ошибки
ошибка и отправленная секунда ожидает адаптер
быть сконфигурирован , но нашел на ява
выяснив, что ID сокращений их
Здравствуйте
здесь вот где Wallaby делает
его выход, чтобы вы всегда могли щелкнуть здесь
и см. бла-бла-бла-бла-бла- бла
но фонетический сбой, и вы должны
вызвать фермент настроить адаптировать вас
адаптер нормально, круто, поэтому скопируйте это
зависать, удалять это удаление, которое продолжается
позвольте мне удалить его там, и нам также нужно
для импорта этого адаптера и некоторого адаптера
нам это нужно, и фермент PMI, устанавливающий PI
поднялся до реактивной стали, поэтому фермент
в основном своего рода инструмент для тестирования
реагировать на рендеринг, это позволяет вам неглубоко
выставлять вещи, и они исправляют их очень
Мне это очень нравится, и вы
собирается любить его , как только вы видите это так
мы получаем это после мелкой
приложение, которое является этим, мы получаем это
обертка и обертка — это в основном наша
любезный порядок поддельный браузер позволяет нам
в
делайте такие вещи, как эта рэпперная точка, и
находит поле ввода входного это
как тупой селектор, здесь это не похоже
и я выбираю, что это немой
селектор, и если мы имитируем
имитировать событие изменения на этом входе
элемент и тот ввод, который мы должны создать
поддельное событие изменения здесь , и это имеет
цели, и эта вещь имеет
значение какого-либо
калькулятор, как говорят пять плюс пять, тогда
как только это событие изменилось
поле ввода приложения, которое мы хотим
оказываемые результаты и результат , и что
где это, скажем, что есть
результат div или что-то, и что имеет
какой-то текст, и это должно быть похоже на
результат, и мы ожидаем, что
оказанные результат быть и что собирается
мы будем ожидать, что это будет десять
это то, что мы собираемся для этих
белые вещи здесь или в этих коробках
это коробочные коробки для валяжей и когда
они белые, они указывают, что
ничего не происходит здесь, это не
это не распространяется, поэтому давайте
нажмите здесь, на выходе Wallaby, и посмотрите
что, черт возьми, не может найти
модульный тест на реакцию делает неглубоким мы
необходимо установить это, а
возможно , я полагаю , что это не является ферментом
вещь, это — вещь, которая реагирует, кто знает
давайте просто установите его ah progressbar
это может быть неправильное зависание может быть
что мой ответ на самом деле 16 да мой
реагента 16, так что это было сделано, я должен
установили, что вы этого не знаете
позвольте мне NPM, что он удалить, удалите это
вещь и некоторые тесты адаптера фокусировки
а затем NPM установите 16 индикатор выполнения I
говорил, что это закрывает это и закрывает
что давайте посмотрим, какая ошибка у нас
есть здесь и методы моделирования только
предназначено для запуска на одном узле 0 найдено
вместо этого да, это имеет смысл, потому что
здесь нет входных элементов
давайте сделаем этот успех или хорошо
не успех, а его прогресс, потому что
когда вы делаете TDD, вы идете красным зеленым
рефакторе вы пишете неудачный тест и
то вы разблокируете его, написав код так
давай действительно прочитаем код, который я собираюсь
написать создать элемент ввода, который
хорошо остыть , а затем мы продвигаемся немного
бит здесь, как сейчас, вы видите здесь, что о
этот экран здесь, и этот тест является добрым
соли согласен Я не понимаю, с
этот экран , но все восемь свинец
экран , потому что он начинает работать
но они здесь, они красные, они
вид своего рода права, они розовые иш
что означает, что этот тест терпит неудачу
эти строки выполняются, но это
один красный
что означает, что это не
это дает нам встроенное сообщение об ошибке
здесь не видно много, потому что хорошо
мой экран действительно маленький
Я хочу показать вам много их
символы для вас на мобильный , но либо
Кстати, позвольте мне прокрутить сюда вас
текст метода предназначен только для
один узел 0 найден вместо этого
как та же ошибка, у нас нет
результат, тем не менее, я собираюсь создать
что div ID или результат нет Мне не нужно
что и там мы идем
нет, нет, нет, я не собираюсь выигрывать
Ожидается, что Нобелевская премия
значение, которое будет использоваться в три раза равным 10
получил пустую строку все прямо сейчас мы
наши части в месте мы имеем это
поле ввода, в котором мы имеем эту плотину здесь
ты знаешь, что я собираюсь удалить это дерьмо
здесь и то, что мы знаем, мы действительно имеем
написать код для написания
сделайте эту работу, позвольте мне написать об изменении
здесь, если немного не изменится, то мы
собираются назвать это при изменении ввода
предположим, возможно, что-то подобное на
изменение ввода, и мы получим
событие от этого и события, так как мы
знай, как это походит на мою фальшивую фальшивку
доминанта у него есть цель, и эта цель
имеет значение и то , что я могу
просто введите это oh nice, тогда я вижу здесь
что вуаля оценивается для нас
это действительно очень удобно, когда вы
делая TDD, чтобы просто выяснить, какие значения
что в какой момент не прибегает
на множество консольных журналов и прочее
на самом деле не так и не делать , что я
мог бы просто сделать это, я думаю, и я бы
получить его и получить его здесь, как это
как специальный волшебный комментарий, который вы
может использоваться в wallaby, и он работает
kwaka — um, но в любом случае давайте посмотрим
давайте посмотрим, что мы хотим сломать, поэтому вы видите
вот что это просто строка , которую мы хотим
сломать это на части так или иначе
возможно, я могу сделать, как хм, давайте сделаем красный
X и давайте искать цифры
давайте пересмотреть то, что это выглядит
Хорошо
все в порядке, мы извлекли цифру здесь
то хорошо, мы хотим сопоставить эту цифру
и мы хотим , чтобы соответствовать операнд
это
Я не знаю, как математика, как плюс, я полагаю
и пока я собираюсь держать это там
мы собираемся добавить умножение и прочее
позже, а затем в-третьих, мы хотим соответствовать
еще одна цифра, я полагаю, все правильно сейчас
вы видите, что здесь у нас есть
строка, которую мы сопоставляем, и тогда у нас есть
в первой части вторая часть и
третья часть, как пять плюс пять, поскольку мы
Оцените здесь, я вижу немного
недостаток нашего теста, как пять плюс пять
это немного глупое число, потому что вы
знаю, что здесь AK это только выглядит
для одной цифры, поэтому я собираюсь
на самом деле расширить наш тест здесь, чтобы быть 25
а затем H должно быть 30
переоценивать
почему ты не очень плохи свои восьмидневные
ожидаемое значение должно быть получено 30
это деньги как-то о, но это
правильно на самом деле это потому, что да квота
это правильно, я тупой, я как мой
reg ex фактически соответствует первому
цифра , так что это он точно делает
правильно, что мой код делает точно
правильно и показать здесь, так что если я
был здесь плюс, и теперь он соответствует 25
до 5 давайте также развернуть второй
быть 10
и измените это на 35, и таким образом я
также раскройте все это прямо сейчас, теперь
части здесь верны, как ожидалось
давайте фактически сделаем Const part this live
комментарий здесь немного, так что я
собираюсь на самом деле оценить здесь
так что это немного более удобно, я
собираюсь удалить это, так что теперь я вижу, что я
делаешь здесь
так что это Const, так что на левой стороне мы
есть части точка один, потому что это
один не первый здесь проверим
что да , это 25 , а затем на его
работают или работают или оператор,
частей — позволяет понять, что это такое
что плюс хорошо не поймал, что
на самом деле давайте сделаем это на отдельном
строка Const оператор да плюс, а затем
мы имеем в правой части
Курс часть точек индекса три видеть , что , как
ну да, хорошо, давай создадим
результат здесь будет , если нет, я не
нужен левый здесь
так что если левая
если оператор равен плюс, то мы идем
сделать результат равен left + right
то мы будем возвращать результат Oh
результат 2510 Я плохо разбираюсь в математике
но я знаю , что это неправильно, поэтому мы
нужно сделать целое синтаксическое разборку здесь так
то, что я собираюсь сделать, это parse parse int
Парси, и тогда мы собираемся сделать
разберитесь здесь, и там мы идем и
Теперь результат 35 правильно
заметьте, как приятно иметь это
Оценка рядный происходит
Даже несмотря на то, что я в середине
тест, который только красный красный красный красный красный
Я все еще получаю этот очень хороший постепенный
когда я пишу код
немедленная обратная связь — очень приятная деталь
об модульном тестировании и TDD в целом, если
у вас хороший пробный запуск и настройка, но
это просто переход на следующий уровень
с этим в линии оценки происходит
это так хорошо, давайте сделаем это
приводят к результатам Dave
так или иначе, мы делаем это состояние набора точек
результат того, что, черт возьми, не может
читать правильно заданное состояние неопределенного О
Бог
классы в JavaScript связывают это там, мы
если это смущает вас, вы можете проверить
из моей серии эпизодов по этому поводу и связать
и мои длинные разглагольствования об этом, но это
не то, о чем мы говорим,
о том, как получить результат в
вот так это точка точка точка результат
не может прочитать результат свойства null
Нет, это имеет смысл, потому что перед нами
установите это состояние здесь, состояние идет
не должно быть ничего , поэтому мы должны дать ему некоторые
построение конструкции начальных состояний или
это состояние равно пустой thingamabob
ошибка ссылки должна вызвать супер да
супер супер спермы супер супер и
тест зеленый mmm, который чувствует себя хорошо
Поэтому это большая вещь с TDD I
думаю , он просто чувствует себя хорошо , он чувствует , как
вы получаете эту постоянную приятность
о смысле прогресса, я думаю, валлаби
вносит немного с этим с
все, что получило зелёную доброту
получив это в редакторе, он чувствует
немного похоже на то, как игра
вознаградит вас за прогресс в порядке следующий
мы собираемся добавить немного или
Please follow and like us:

Be First to Comment

Добавить комментарий