Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Issue with DateItem pickerIcon click with SVG / <object> in IE11

    Hi Isomorphic,

    please see this sample (v11.1p_2018-04-16) and change the code to:
    Code:
    isc.DynamicForm.create({
        ID: "dateForm",
        width: 620,
        fixedColWidths: true,
        colWidths: [190, "*"],
        isGroup: true,
        groupTitle: "Date Controls",
        fields : [{
            name: "dateItem2", title: "Date", hint: "<nobr>Direct date input</nobr>", 
            editorType: "DateItem",
            useTextField: true,
    pickerIconSrc: "[SKINIMG]NavigationBar/miniNav_up.svg"
        }]
    });
    Now in IE11/Win10, a click on the icon does not open the DateChooser. This is the error log in the developer console:
    Code:
    Developer Console - error encountered when checking if server timings are switched on - assuming the 'areServerTimesTracked' and 'trackServerTimings' built-in RPCs are disallowed, will avoid tracking of server timing data
    12:37:47.259:focusin8:WARN:nativeFocus:isc_SimpleTabButton_1:Button: Intercepting native focus from mouseDown on table cell and resetting to handle.
    12:37:54.782:focusin1:WARN:nativeFocus:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton:Button: Intercepting native focus from mouseDown on table cell and resetting to handle.
    [B]12:39:36.709:WARN:Log:TypeError: Das Objekt unterstützt die Eigenschaft oder Methode "logWarn" nicht
    Stack from error.stack:
        unnamed()[/B]
    Click image for larger version

Name:	IE11_SVG_Click.png
Views:	271
Size:	63.1 KB
ID:	252799

    This is the exact IE11 Version:
    Click image for larger version

Name:	IE11_Version.PNG
Views:	96
Size:	18.3 KB
ID:	252800

    This is an important one for me, as a customer reported it.

    Best regards
    Blama

    #2
    This is due to what seems to be a buggy interaction in IE11 between our "pointer-events:none" CSS that we add to the <object> to allow the Framework to receive clicks on the SVG, and other CSS written into <object> for alignment. The warning you saw was caused by IE modifying the page location (URL) in response to the click - a very strange reaction to be sure.

    We've modified the CSS for the affected branches, SGWT 6.1p/SC 11.1p and newer, and the change will be in the nightly builds dated 2018-04-20 and beyond.

    Comment


      #3
      Hi Isomorphic,

      this is working now, but has a visual issue now. Please see this video for the same testcase using v11.1p_2018-04-20:

      Click image for larger version

Name:	IE11 Starting DateChooser.gif
Views:	112
Size:	56.7 KB
ID:	252917

      Best regards
      Blama

      Comment


        #4
        The picker icon is stateful, so the primary issue is that there's no "_Over" variant of the SVG file you reference in your sample code. This causes a blank (or broken) image to be shown in all browsers.

        Now, it's true that IE seems to differ in that it shows the blank/broken image with what appearas to be a large size that yields scrollbars, but presumably you don't your want app to have an blank image at all in that situation, right?

        Comment


          #5
          Note that you can suppress the rollover state for the icons of a FormItem by setting FormItem.showOver: false - then the extra SVG file isn't needed.

          Comment


            #6
            Hi Isomorphic,

            thanks, that was a stupid one. I did not test with another browser, which surly would have sent me down the right path.

            Best regards
            Blama

            Comment


              #7
              Hi Isomorphic,

              this one is still open w.r.t. redraws in current 12.1d / 12.0p (v12.0p_2019-12-07, Chromium 78). The icon does not come back on unhover (so when _over is removed again), see here:

              Code:
              isc.DynamicForm.create({
                  ID: "dateForm",
                  width: 620,
                  fixedColWidths: true,
                  colWidths: [190, "*"],
                  isGroup: true,
                  groupTitle: "Date Controls",
                  fields : [{
                      name: "dateItem2", title: "Date", hint: "<nobr>Direct date input</nobr>", 
                      editorType: "DateItem",
                      useTextField: true,
              [B]        //showOver: false, // Icon not coming back if this is commented out[/B]
                      pickerIconSrc: "[SKINIMG]NavigationBar/miniNav_up.svg"
                  }]
              });
              IE Edge (Win10 EdgeHTML 18.18362) is behaving more correct, so is FF26.
              Of course one should have correct images and no 404s in general, but this might be an issue somewhere else as well.

              Best regards
              Blama

              Comment


                #8
                We see and are looking into a solution.

                Comment


                  #9
                  We've fixed the issue affecting your sample code and made some other improvements in that area as well. The changes have been applied to SC 11.1p and newer releases and should be in the nightly builds dated 2019-12-18 and beyond.

                  Comment

                  Working...
                  X