Uncaught in promise typeerror fullscreen error

Сломался полноэкранный режим на сайте (fullscreen) при обновлении Chrome 71 / Firefox etc. + решение

заметить можно в фотоальбомах

В новой версии Chrome версии 71 команда Chromium поменяла логику работы функции javaScript «requestFullscreen», из-за чего перестала работать кнопка на фотографиях «Открыть в полноэкранном режиме» в компоненте Фотоальбом. Подробности по изменениям можно найти здесь — developer.mozilla.org/en-US/docs/Web/API/Element/requestFullScreen .

В текущий момент пострадали абсолютно все сайты, работающие на платформе InstantCMS, но реально это заметят только те, кто в работе использует полноэкранный режим (например, в фотоальбомах). Там при попытке открыть полноэкранный режим вылезает следующая ошибка:

Uncaught (in promise) TypeError: Failed to execute ‘requestFullscreen’ on ‘Element’: parameter 1 (‘options’) is not an object.
at Object.request (screenfull.js?1525189823:7)
at Object.toggle (screenfull.js?1525189823:7)
at HTMLDivElement. (photos.js?1525189823:87)
at HTMLDocument.dispatch (jquery.js?1525189823:3)
at HTMLDocument.r.handle (jquery.js?1525189823:3)

В InstantCMS за fullscreen отвечает либа «screenfull.js», она находится по адресу «templatesdefaultjsscreenfull.js».
Разработчик этой либы несколько дней назад выкатил новую версию, её можно забрать здесь — github.com/sindresorhus/screenfull.js (там по ссылке найдите файл версии 4.0.0, или выше, он работает, надо просто заменить этим файлом старую либу) .

На своем проекте я либу уже обновил, у меня полноэкранный режим заработал и работает штатно.

Источник

Fullscreen error on double click #1860

Browser: Chrome 77.0.3865.90

OS: Windows 10

Clappr Version: 0.3.9

Steps to reproduce:

• first step
  Open console then double click on player:

Uncaught (in promise) TypeError: fullscreen error

Did you try to reproduce this issue at http://cdn.clappr.io/

The text was updated successfully, but these errors were encountered:

Thank you @fabioricali , i confirm the issue.

WIth Chrome 77.0.3865.90, double-clicking player switch player to fullscreen mode and trigger an «Uncaught (promise) TypeError: fullscreen error»

It seems not to be a critical issue because fullscreen feature still works. (may be a Chrome temporary issue).

@fabioricali as @kslimani answered it seems to be a Chrome issue. I checked the event handler chain and the fullscreen call is being done directly on the event handler stack.

I’ll close this issue for now since the feature is working and the problem seems to be related directly to Chrome (and Chromium-based browsers). If the problem persists or the feature breaks we can revisit it.

If the problem persists, i will eventually push a fix which catch and silent this uncommon promise Error.

@kslimani just so you know, we’re splitting the Clappr codebase into separate projects: one with the core components and another with the main plugins, which will be converted into a monorepo.

The playbacks are being split into their own projects as well: hlsjs-playback, flashls-playback and flash-playback.

This will allow us to release more fine-grained package updates, and allow us to better keep track of issues and pull requests. Another upside from this is that users can build their own versions of Clappr without being burdened with unused plugins.

Источник

Fullscreen: «exitFullscreen» leads to «Document not active» JS error in Chrome 71 #1667

Thanks for all your work with grapesjs.

I’ve been integrating your editor for a few months now, and I’ve just discovered that using the Fullscreen button in Chrome 71 leads to a «Document not active» error in the JavaScript console:

grapes.min.js?v0.14.43:3 Uncaught (in promise) TypeError: Document not active
at i.disable (grapes.min.js?v0.14.43:3)
at i.stop (grapes.min.js?v0.14.43:3)
at i.callStop (grapes.min.js?v0.14.43:3)
at Object.stopCommand (grapes.min.js?v0.14.43:12)
at i.updateActive (grapes.min.js?v0.14.43:12)
at m (grapes.min.js?v0.14.43:2)
at v (grapes.min.js?v0.14.43:2)
at h (grapes.min.js?v0.14.43:2)
at i.c.trigger (grapes.min.js?v0.14.43:2)
at i.set (grapes.min.js?v0.14.43:2)

This seems to be quite recent, and happens with your online Newsletter demo: https://grapesjs.com/demo-newsletter-editor.html

Just click on the Fullscreen button, and you should get the error as well.

The same issue has been reported on another GitHub project:
jpilfold/ngx-image-viewer#23

A workaround seems to check whether fullscreen mode is active or not (eg. document.fullscreen, window.fullScreen). I tried this with grapesjs, if I check this before running or stopping the fullscreen command, there are less errors, but there’s still an error while calling disable() from fsChanged() in the Fullscreen module code:

grapes.js Uncaught (in promise) TypeError: Document not active
at child.disable (grapes.js:27755)
at child.stop (grapes.js:27787)
at child.fsChanged (grapes.js:27769)

Hope you’ll have enough information to investigate.
Feel free to ask if necessary!

The text was updated successfully, but these errors were encountered:

Источник

Обработка ошибок в асинхронных функциях

В ES2017 появились асинхронные функции, которые позволяют сделать асинхронные вызовы более плоскими и похожими на синхронные.

Асинхронные функции работают на промисах. Очень грубо говоря await внутри асинхронной функции как бы приостанавливает её выполнение, ждёт, когда зарезолвится промис, указанный после него, и возвращает результат.

И на первый взгляд в асинхронных функциях есть проблемы с обработкой ошибок.

Промисы

Допустим, у нас есть функция loadPost , которая получает с сервера статью и работает на промисах. Метод fetch отправляет запрос на указанный адрес, и возвращает промис, который мы в дальнейшем можем обработать.

Если всё хорошо, получаем данные с помощью .json , который тоже возвращает промис. Если что-то пошло не так, отловим ошибку в .catch .

Асинхронные функции

Попробуем переписать эту функцию, используя async/await . Делаем её асинхронной с помощью ключевого слова async , без этого бы не сможем использовать await внутри.

Вторая строка совершает запрос, await «разворачивает» промис и возвращает значение, которое записывается в переменную response . Третья строка получает джейсон и записывает значение в переменную data .

Пока запрос проходит без ошибок у нас всё хорошо. Но если что-то пойдёт не так, выскочит исключение:

Обработка ошибок

Окей, используем try-catch , чтобы отловить ошибку:

Вроде нормально, но функция стала больше, да и запросы могут быть разными, а каждый раз писать try-catch запарно.

Вспоминаем, что асинхронная функция возвращает промис, поэтому можно использовать .catch , чтобы отловить ошибку:

Это решает проблему с повторами try-catch , но не решает проблему с дублированием кода. Здесь может помочь функция высшего порядка.

Запрос остался без изменений, но добавилась функция tryCatchWrapper . Она принимает как аргумент функцию handleError , которая будет обрабатывать исключения, и возвращает новую функцию.

Эта новая функция принимает функцию запроса, который мы собираемся отправлять, и возвращает ещё одну функцию. Эта конечная функция принимает параметры, которые будет передавать в функцию запроса, когда мы вызовем её.

По-умному это ещё называют каррированием: когда мы из одной функции с несколькими аргументами делаем несколько функций, которые принимают по одному аргументу. Так мы можем «запоминать» аргументы, не вызывая функцию сразу, а вызывать её потом.

Всё это вместе позволяет написать несколько обработчиков ошибок, которые будут применять разные функции в зависимости от наших целей. Например, если мы захотим использовать другой обработчик для какого-то запроса, мы можем передать как аргумент другую функцию:

И при этом не будет дублирования кода, потому что вся обработка находится внутри tryCatchWrapper .

Источник

Ошибка Uncaught (in promise)

Распознавание ошибок — обычное дело для программистов и веб-мастеров, самостоятельно прописывающих программные коды для своих ресурсов. Но порой с сообщением Error сталкиваются обычные пользователи, не имеющие даже приблизительного понятия о том, как быть в сложившейся ситуации. И возникает ступор: что делать? То ли свои действия исправлять, то ли вызывать специалистов, то ли технику уже на свалку везти?

Ошибка Uncaught (in promise) может появляться при работе с JavaScript, браузерами, приложениями и даже мессенджерами. Для понимания причины значение имеет характеристика конкретного сбоя, выводимая после Error.

В любом случае, это ошибка, возникшая в кодировке асинхронной операции с использованием функции обратного вызова. Снижая производительность кода до нуля, формально она не является критичной и, при распознавании, легко устраняется. Однако диагностировать причину бывает крайне трудоемко — именно на это указывает термин Uncaught (“необработанная”). И разобраться с возникающей проблемой по силам только грамотному и внимательному мастеру. Новичку же лучше обратиться за подсказкой к более опытным коллегам.

Для решения проблемы разработчику, как правило, предстоит вручную перебирать все варианты, которые способны вызвать несоответствие и сбой, устраняя конфликт между поставленной задачей и возможностью ее исполнения.

На практике промисы создаются как раз для того, чтобы перехватить ошибку, понять, на каком именно участке кода она возникает. Если бы не использовался Promise, команда просто оставалась бы без исполнения, а пользователь пребывал в неведении: почему та или иная функция не срабатывает? Очевидно, что информирование существенно упрощает задачу и сокращает время на реставрацию процесса.

При определении ошибки, перебирая цепочки, находят функцию, нарушающую логику. Ее обработка приводит к восстановлению работы системы. По сути, promise — это объект, не идущий в систему, а возвращающий в исходную точку сообщение о том, насколько удачно прошла операция. Если же произошел сбой — то какова его вероятная причина.

В то же время многократное использование промисов, связанное с ожиданием ответа, замедляет работу ресурса, утяжеляет его. Поэтому злоупотреблять удобной конструкцией не следует, как бы ни хотелось. Решение заключается в том, чтобы выбрать наиболее важный (или наиболее уязвимый) связующий блок, и именно на него установить необходимый код промис.

Работа по диагностике и обработке ошибок

Собственно, работа по диагностике и обработке ошибок, возникающих при создании сайтов, приложений или даже текстов в редакторе, почти всегда идет по тому же алгоритму: простым перебором исключаешь ошибочные варианты, один за другим.

Наглядный тому пример — поиск ответа на вопрос, почему перестали работать сочетания клавиш Ctrl+C и Ctrl+V. Комбинации “горячих клавиш” могут отказаться реагировать на нажатие из-за заражения вирусом, загрязнения клавиатуры, целого ряда других факторов. Тестируя их один за другим, раньше или позже непременно выйдешь на истинную причину — и тогда уже сможешь ее устранить.

Аналогично необходимо действовать при возникновении ошибки Uncaught (in promise): проверяя строчку за строчкой, каждый показатель, находить неверное значение, направляющее не туда, куда планировалось, переписывать его и добиваться намеченной цели.

Если вы не являетесь разработчиком, не создаете авторских приложений, не владеете профессиональным языком и никогда не касались даже близко программных кодов, но столкнулись с ошибкой Uncaught (in promise), прежде всего проверьте технику на присутствие вирусов. Запущенный злоумышленниками вредитель мог покалечить вашу систему в своих интересах. Второй шаг — попытка восстановления системы в точке, где она благополучно работала ранее. Вспомните, какие обновления вы устанавливали в последнюю очередь, попытайтесь избавиться от них. Если речь не идет о создаваемой вами авторской программе, избавиться от ошибки поможет переустановка поврежденного приложения. Если не поможет и это — остается обратиться к специалисту, способному исправить кодировку. При этом знайте, что проблема — не в “железе”, а в сбое используемого вами программного обеспечения.

Источник

posted on July 10th, 2019

<iframe allowfullscreen></iframe>