iOS 13, safari, в категориях не откликаются ссылки подкатегорий


#1

В мобильной версии сайта, iOS 13 ,браузер Safari, некорректно работают подкатегории каталога, не откликаются. Если нажать на раскрытие категории например “electronics” то в неё перейдет корректно, но при нажатии на подкатегории ничего не происходит.
И так же не закрывается категория обратно при нажатии на скрытие подкатегорий. Элементы вообще не активны.
Проверено на dev.demo.cs-cart.com


iOS 13.1 - перестали работать ссылки в меню
#2

Подтверждаем, очень серьезный баг - просьба @cs-cart_team быстрее выложить фикс.


#3

Временное решение для версии 4.10.x:
I. Автоматический вариант:
Diff-файл:


Инструкция, как воспользоваться этим файлом:
https://www.cs-cart.ru/docs/latest/upgrade/apply_diff_file.html

II. Ручной вариант

II. Ручной вариант:

  1. Открыть файл:
    js/tygh/responsive.js

  2. Найти функцию detectMenuWidth (около 154 строки).

  3. Найти в ней функцию _getSubmenuOriginWidth (около 198 строки).

  4. Заменить код:

             function _getSubmenuOriginWidth ($submenu) {
                 $submenu.css({ visibility: 'hidden', left: 0 });
                 var _width = $submenu.outerWidth() || 0;
    
                 // remove inline styles perfectly
                 $submenu.get(0).style.left       = '';
                 $submenu.get(0).style.visibility = '';
    
                 return _width;
             }
    

на код:

            function _getSubmenuOriginWidth ($submenu) {
                // FIXEME: iOS 13 bug with visibility: hidden
                // $submenu.css({ visibility: 'hidden', left: 0 });
                // var _width = $submenu.outerWidth() || 0;
                var _width = $submenu.position().left + $submenu.width();

                // remove inline styles perfectly
                // $submenu.get(0).style.left       = '';
                // $submenu.get(0).style.visibility = '';

                return _width;
            }

Временное решение для версии 4.9.x:
I. Автоматический вариант:
Diff-файл:


Инструкция, как воспользоваться этим файлом:
https://www.cs-cart.ru/docs/latest/upgrade/apply_diff_file.html

II. Ручной вариант

II. Ручной вариант:

  1. Открыть файл:
    js/tygh/responsive.js

  2. Найти функцию detectMenuWidth (около 148 строки).

  3. Заменить код:

             var elm = $(e.target);
             var menuElm = elm.parents(".cm-responsive-menu");
             var isHorisontalMenu = menuElm.parent().hasClass("ty-menu-vertical") ? false : true;
    
             if(isHorisontalMenu) {
                 var menuWidth = menuElm.outerWidth();
                 var menuOffset = menuElm.offset();
                 var menuItemElm = elm.closest('.cm-menu-item-responsive');
                 $('.ty-menu__submenu-to-right').removeClass('ty-menu__submenu-to-right');
                 var submenu, position;
    
                 // Detect menu collisions
                 if(menuItemElm) {
                     if(typeof menuItemElm.offset()  !== "undefined") {
                         menuWidth = menuWidth - (menuItemElm.offset().left - menuOffset.left)
                     }
                     submenu = $('.cm-responsive-menu-submenu', menuItemElm).first();
                     
                     if(submenu.length) {
                         submenu.css({visibility: "hidden", left: 0});
                         position = submenu.outerWidth();
                         if(position > menuWidth) {
                             submenu.parent().addClass('ty-menu__submenu-to-right');
                         }
                         submenu.css({visibility: "", left: "auto"});
                     }
    
                 }
             }
    

на код:

            var elm = $(e.target);
            var menuElm = elm.parents(".cm-responsive-menu");
            var isHorisontalMenu = menuElm.parent().hasClass("ty-menu-vertical") ? false : true;

            if(isHorisontalMenu) {
                var menuWidth = menuElm.outerWidth();
                var menuOffset = menuElm.offset();
                var menuItemElm = elm.closest('.cm-menu-item-responsive');
                $('.ty-menu__submenu-to-right').removeClass('ty-menu__submenu-to-right');
                var submenu, position;

                // FIXEME: iOS 13 bug with visibility: hidden
                // Detect menu collisions
                // if(menuItemElm) {
                //     if(typeof menuItemElm.offset()  !== "undefined") {
                //         menuWidth = menuWidth - (menuItemElm.offset().left - menuOffset.left)
                //     }
                //     submenu = $('.cm-responsive-menu-submenu', menuItemElm).first();
                    
                //     if(submenu.length) {
                //         submenu.css({visibility: "hidden", left: 0});
                //         position = submenu.outerWidth();
                //         if(position > menuWidth) {
                //             submenu.parent().addClass('ty-menu__submenu-to-right');
                //         }
                //         submenu.css({visibility: "", left: "auto"});
                //     }

                // }
                if (menuItemElm) {
                    var submenu = $('.cm-responsive-menu-submenu', menuItemElm);
                    if (submenu.length) {
                        var position = submenu.position().left + submenu.width();
                        if (position > menuWidth) {
                            submenu.parent().addClass('ty-menu__submenu-to-right');
                        }
                    }

                }
            }

Причина бага: баг вызван из-за некорректной работы CSS-свойства visibility: 'hidden' на iOS 13.


iOS 13.1 - перестали работать ссылки в меню
#4

Не только Сафари - все браузеры. Яндекс проверено точно так же ведет. И у меня второй клик не помогает.


#5

У меня нет там этой функции, есть вот что:

                // Detect menu collisions
                if(menuItemElm) {
                    if(typeof menuItemElm.offset()  !== "undefined") {
                        menuWidth = menuWidth - (menuItemElm.offset().left - menuOffset.left)
                    }
                    submenu = $('.cm-responsive-menu-submenu', menuItemElm).first();
                    
                    if(submenu.length) {
                        submenu.css({visibility: "hidden", left: 0});
                        position = submenu.outerWidth();
                        if(position > menuWidth) {
                            submenu.parent().addClass('ty-menu__submenu-to-right');
                        }
                        submenu.css({visibility: "", left: "auto"});
                    }

                }

#6

Всем привет. Такая беда. Есть сайт https://www.stencil-library.ru/ есть на нем в мобильном варианте выпадающее меню. Все работало отлично до обновления на iOS 13.1

Теперь - стрелка раскрытия работает, ссылка в заголовке меню работает (например - МЕНЮ - КАТАЛОГ ТРАФАРЕТОВ) но далее все ссылки ниже - не работают, причем в любом браузере а не только в Сафари.

По прежнему все нормально на других мобильных ОС, а так же на iOS 12.4.

Меню глубокой переделки не подвергалось. Что бы это могло быть?

CS-CART 4.3.6 стандартная чуть причесанная тема Responsive


#7

С этой проблемой столкнулись сейчас все. С 13.1 - они открываются, если кликнуть дважды по ссылке.
Решение пока предлагалось только одно, не знаю актуально ли для вашей версии CS-Cart:


#8

У меня вообще мертвые, хоть два раза - хоть три кликай… На демо-магазине вижу да, там дважды - работает.

Еще обратил внимание, даже рабочие ссылки если в Сафари удержать нажатие - должно открыться приглашение выбрать что делать со ссылкой. Теперь не открывается. Не понимает почему-то iOS 13.1 ссылки.


#9

И, да, у меня нет этих функций. Так что решение - не для меня.


#10

Иос 13, подверждаю) на сайте топикстартера меню не работает :frowning:

На моем оказывается тоже, благо не запущен еще(юнитема2 дефолт)


#11

Дополнил временное решение для версии 4.9.x:


#12

Супер. А для 4.3.6 можно?


#13

Позволю себе вмешаться, так как разработчики безмолвствуют.

  1. Указанный фикс для 4.9.х у меня сработал на 4.3.6
  2. Последняя скока закрывающая в блоке “заменить на” - ЛИШНЯЯ!
  3. Зачем менять ВСЮ функцию, когда достаточно поменять лишь блок что в цитате выше?
  4. Почему фикс назван “временным”?

И далее: тем не менее, ссылки на сайте перестали быть “ссылками” с точки зрения Safari iOS - при длинном нажатии не выскакивает интерфейс “что делать со страницей по ссылке” хотя сама ссылка работает!


#14
  1. Указанный фикс для 4.9.х у меня сработал на 4.3.6

CS-Cart не предоставляет фиксы для предыдущих версий. Если у вас предыдущая версия, то можно обратиться в Helpdesk.
Я всё же дополнительно предоставил фикс для 4.9.x. Для предыдущих версий должно быть аналогично. Главное понимать суть бага с некорректной работой visibility: 'hidden' на iOS 13.

  1. Последняя скока закрывающая в блоке “заменить на” - ЛИШНЯЯ!

Количество открывающих и закрывающих скобок в решении одинаковое. Так что лишних нет.

  1. Зачем менять ВСЮ функцию, когда достаточно поменять лишь блок что в цитате выше?

В крайних случаях возникает баг. Поэтому необходима полная замена.

  1. Почему фикс назван “временным”?

Потому что он не проходил полноценный этап тестирования.

ссылки на сайте перестали быть “ссылками” с точки зрения Safari iOS - при длинном нажатии не выскакивает интерфейс “что делать со страницей по ссылке”

Вот и ответ на вопрос :slight_smile: :

  1. Почему фикс назван “временным”?

Полноценный фикс будет после того, как задача пройдет тестирование.


#15

@a.shishkin, @Kaavain_new, @myway, @migpa

Здравствуйте!

Мы исправили проблему. Исправление войдет в CS-Cart 4.10.5.

Если вы хотите внести исправления, не дожидаясь выхода следующей версии, воспользуйтесь diff-файлом

Вот инструкция, как воспользоваться этим файлом:
https://www.cs-cart.ru/docs/latest/upgrade/apply_diff_file.html

Внимание: если уже применялся временный фикс, то его нужно откатить. Не применяйте diff-файл поверх фикса.


UniTheme2 - второе поколение премиум шаблона от AB
#16

Вот эта строчка
$submenu.css(‘left’, 0);
вызывает скриптовую ошибку.

Нужно так:
$submenu.css({‘left’, 0});


#17

С обновлением IOS до 13.1.3 проблем вернулась :man_facepalming:
Не работает раскрытие категории.