x
 
Василий
26 июля 2018
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Как бороться с багами? Часть седьмая: исправить


Когда баг ста­бильно вос­про­из­во­дится, а его при­чина понятна, пора исправ­лять код.

У этого про­цесса две задачи: испра­вить баг и не доба­вить новых. Чтобы про­ве­рить, что баг исправ­лен и исправ­ле­ние ничего не сло­мало, пона­до­бятся авто­ма­ти­че­ские или руч­ные тесты.

В общем виде алго­ритм исправ­ле­ния бага выгля­дит так:

  1. Убе­диться, что теку­щие тесты в чистой копии про­екта про­хо­дят без ошибок.
  2. Доба­вить или изме­нить суще­ству­ю­щий тест так, чтобы он про­ве­рял отсут­ствие бага. В этот момент тест дол­жен стать «крас­ным», потому что самого исправ­ле­ния пока нет.
  3. Испра­вить код.
  4. Убе­диться, что баг исчез: крас­ный тест дол­жен позеленеть.
  5. Убе­диться, что мы не доба­вили новых багов: все осталь­ные тесты также должны пройти успешно.

Ино­гда баг не полу­ча­ется испра­вить: напри­мер, при­чина бага не в коде, а в глюке бра­у­зера. В таких слу­чаях сове­тую заме­нить реше­ние или побо­роть последствия.

Заменить решение

Если код опи­ра­ется на тех­но­ло­ги­че­ское реше­ние, из‑за кото­рого и появ­ля­ется баг, можно заме­нить решение:

В Школьном кабинете

Пре­по­да­ва­тели жалу­ются, что при выстав­ле­нии оце­нок про­па­дают ссылки на работы студентов:

У Андрея Голо­вина видны оценки, но нет ссылки на саму работу

Про­блема ока­зы­ва­ется в панели поиска, кото­рая появ­ля­ется в Сафари. Она вли­яет на высоту экрана, но не на стили. Из‑за этого 100vh (100% высоты экрана) равны ста­рой высоте, а ссылка на работу зале­зает под оценки.

Заме­няем реше­ние: вме­сто 100vh исполь­зуем ЦСС‑пере­мен­ную --viewHeight, кото­рую сами счи­таем и обнов­ляем Яваскриптом.

На новом сайте бюро

Дизай­нер нашёл баг: при ресайзе форма оплаты уез­жает за гра­ницы экрана:

Про­блему сна­чала искали в про­крутке и фик­си­ро­ван­ном пози­ци­о­ни­ро­ва­нии

Про­блема ока­зы­ва­ется в ЦСС‑ани­ма­ции формы оплаты: при ресайзе Сафари обнов­ляет коор­ди­наты формы, но не пере­ри­со­вы­вает её.

Заме­няем реше­ние: вме­сто ЦСС‑ани­ма­ции берём транзишен.

Побороть последствия

Если баг никак не испра­вить, оста­ётся бороться с его последствиями:

В Издательстве бюро

Чита­тели жалу­ются на под­светку резуль­та­тов поиска в Хроме: при пере­ходе к най­ден­ному раз­во­роту Хром про­кру­чи­вает его за пре­делы экрана.

Про­блема ока­зы­ва­ется в Хроме: бра­у­зер непра­вильно счи­тает рас­сто­я­ние до зали­па­ю­щей стра­ницы, воз­вра­щая высоту раз­во­рота вме­сто ноля.

Боремся с послед­стви­ями: исправ­ляем код, про­кру­чи­ва­ю­щий книгу к резуль­та­там поиска. Если резуль­тат поиска нахо­дится на зали­па­ю­щей стра­нице и у неё невер­ные коор­ди­наты, берём полу­чив­шу­юся ошибку и вычи­таем её из коор­ди­наты, к кото­рой соби­ра­лись про­кру­чи­вать книгу. В резуль­тате мы скрол­лим книгу к «непра­виль­ной» пози­ции, но попа­даем точно в начало разворота.

На новом сайте бюро

Ино­гда в Сафари форма оплаты после появ­ле­ния пере­стаёт про­кру­чи­ваться: не реа­ги­рует на скролл и изме­не­ние scrollTop. Про­блема исче­зает после ресайза.

Боремся с послед­стви­ями: застав­ляем бра­у­зер пере­счи­тать и пере­ри­со­вать форму оплаты. Сразу после появ­ле­ния формы очи­щаем её transform, а через 50 мил­ли­се­кунд при­ме­няем transform: scale(1). Бра­у­зер пере­ри­со­вы­вает форму и скролл начи­нает рабо­тать пра­вильно, но визу­ально для поль­зо­ва­теля ничего не меняется.

Что запомнить

Баг мало испра­вить, нужно ещё и не доба­вить новых исправ­ле­нием. Под­твер­дить это помо­гают тесты.

Если баг не полу­ча­ется испра­вить, можно заме­нить реше­ние или побо­роть послед­ствия бага.

Ещё по теме

P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.
Вёрстка и прототипирование — дисциплина Школы дизайнеров. Набор открыт. Чем раньше поступите, тем ниже стоимость и выше шанс на бесплатное место.
 

Поделиться
Отправить

Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.

Как написать аккуратный код? Часть четвёртая: ответственность Расскажите, как автор советов работает с маргиналиями? Отслеживаете ли вы производительность программистов? Как и когда зарождающийся стартап в процессе своего развития должен подходить к вопросу имплементации билинга?




Недавно всплыло

Многие издания тарифицируют гонорар по общей ставке или по просмотрам 2 Что делает сео-специалист? 1 9 Висячие предлоги в английском 1