Return to Question

1. A simple HTML page that is about 1200px high to force some scrolling. https://downloads.fuseit.com/Utils/debug/basic.html

2. A Connected App using the simple HTML page for the Start URL, Canvas App URL, and Callback URL. The Canvas App Settings are using an Access Method of Signed Request and the Locations are Visualforce Page and LightningComponent

3. A Visualforce page referencing the canvas app. The height needs to be sufficient to see the whole iframed page as we won't be calling the Canvas resize code.

   apex:page
   <apex:CanvasApp developerName="ChromeScrollTest" height="1200px" maxHeight="infinite" maxWidth="infinite" border="1"/> </apex:page>

4. A Lightning component referencing the canvas app. Again, defining the height.

   <aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" > <force:canvasApp developerName="ChromeScrollTest" height="1200px"/> </aura:component>

1. A simple HTML page that is about 1200px high to force some scrolling. https://downloads.fuseit.com/Utils/debug/basic.html
2. A Connected App using the simple HTML page for the Start URL, Canvas App URL, and Callback URL. The Canvas App Settings are using an Access Method of Signed Request and the Locations are Visualforce Page and LightningComponent
3. A Visualforce page referencing the canvas app. The height needs to be sufficient to see the whole iframed page as we won't be calling the Canvas resize code.

vf:

<apex:page>   
  <apex:CanvasApp developerName="ChromeScrollTest" height="1200px" maxHeight="infinite" maxWidth="infinite" border="1"/>
</apex:page>

1. A Lightning component referencing the canvas app. Again, defining the height.

cmp:

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" >
    <div class="canvas-container">
        <force:canvasApp developerName="ChromeScrollTest" height="1200px"/>
    </div>
</aura:component>

After much effort on my part I've created a simpler reproduction of the bug. The parts are as follows:

1. A simple HTML page that is about 1200px high to force some scrolling. https://downloads.fuseit.com/Utils/debug/basic.html

2. A Connected App using the simple HTML page for the Start URL, Canvas App URL, and Callback URL. The Canvas App Settings are using an Access Method of Signed Request and the Locations are Visualforce Page and LightningComponent

3. A Visualforce page referencing the canvas app. The height needs to be sufficient to see the whole iframed page as we won't be calling the Canvas resize code.

   apex:page
   <apex:CanvasApp developerName="ChromeScrollTest" height="1200px" maxHeight="infinite" maxWidth="infinite" border="1"/> </apex:page>

4. A Lightning component referencing the canvas app. Again, defining the height.

   <aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" > <force:canvasApp developerName="ChromeScrollTest" height="1200px"/> </aura:component>

Then just load either the Visualforce page or the Lightning Component (embedded in an app) and observe the rendering issues.

One workaround for this is to have the user manually change the magnification to 110%. The change seems to force chrome to render the selects correctly.