942989 - Lectio website does not work in Firefox for Android phone

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect)

Description

[Kevin Brosnan]

Attachment: Screenshot of FxA

Clicking on the modul listings should expand. On Firefox for Android the box increases in size only slightly.

Developer site
http://macom.dk/publish/da/lectio.htm

Comment 1

[Kevin Brosnan]

Attachment: Screenshot of Chrome

Comment 2

[Mike Taylor [:miketaylr]]

The problem is here in the following inline script:

<script type="text/javascript">
  $(document).ready(function () {
    $('body').delegate('.s2withlink', 'click', function () {
      var tt = $(this).find('.s2mobiltitle');
      if (tt.length == 0) {
        var newDiv = $("<div />");
        newDiv.attr('class', 's2mobiltitle');
        newDiv.get(0).innerText = $(this)[0].title;
        newDiv.css('display', 'none');

        $(this).append(newDiv);
      }

      $(this).parent().find('.s2mobiltitle').toggle();
      return false;
    });
  });
</script>

More specifically, the div.s2mobiltitle elements are empty in Gecko-based browsers due to this line:

newDiv.get(0).innerText = $(this)[0].title;

We don't implement innerText. A little odd that they're using innerText directly, since they're using jQuery in the same function.

Changing this to newDiv.text($(this)[0].title) will make this work everywhere* (as jQuery abstracts the differences between innerText and textContent for you. 

*Bonus points if they change it to newDiv.text(this.title) and avoid creating a new jQuery instance just to access a property on `this`.

Comment 3

[Karl Dubost💡 :karlcow]

To be contacted 

There is a support email for [e-mail]
Michael Herold, Developer Manager, herold at macom.dk
http://www.linkedin.com/in/herold

Comment 4

[andershol]

Thanks for the analysis. Site contacted via support.

Comment 5

[Hallvord R. M. Steen [:hallvors]]

Thank you for contacting them :)

Comment 6

[Karl Dubost💡 :karlcow]

I think this has been fixed. In all places where they had innerText it seems to have been replaced by a combination of textContent and innerText.

            if (IsExplorer) {
                document.getElementById(SelectboxNS_LastDisplayID).innerText = '';
            }
            else {
                document.getElementById(SelectboxNS_LastDisplayID).textContent = '';
            }


and

        if (IsExplorer) {
            document.getElementById(DisplayID).innerText = SelectboxNS_SearchStr;
        }
        else {
            document.getElementById(DisplayID).textContent = SelectboxNS_SearchStr;
        }

and

            TOptionTxt = (IsExplorer ? CBox.options[i].innerText : CBox.options[i].textContent);

and

        SelectboxNS_TimeOutCode = SelectboxNS_TimeOutCode + 'document.getElementById(\'' + DisplayID + '\').' + (IsExplorer ? 'innerText' : 'textContent') + ' = \'\';';


I'm not sure that testing the browser is a good thing for IE and its future version. It forces them to keep the code for the future.

Comment 7

[Karl Dubost💡 :karlcow]

Thanks Anders

Comment 8

[Hallvord R. M. Steen [:hallvors]]

I now get a more desktop-like page on this URL, also in Chrome. Perhaps they dropped the mobile-adapted version of their site?