I am facing an issue with the Locker Service. I have a simple piece of code which reads HTML table rows. I have attached the code here. The issue is that if the Locker Service is disabled, I am able to read the HTML table rows and the console output is as shown in the screenshot. Whereas, if it is enabled, the HTML table rows is displayed as undefiend on the console output. I have attached both screenshots as well as the code. Summer 16 - Salesforce
DemoTestApp.app
<aura:application >
<c:DemoTest />
</aura:application>
DemoTest.cmp
<aura:component >
<ui:button class="btn" label="Create Table" press="{!c.createTable}"/>
<ui:button class="btn" label="Read Table" press="{!c.readTable}"/>
<div id="divTest">
</div>
</aura:component>
DemoTestController.js
({
createTable : function(component, event, helper) {
var staticTable,table,tablehead,tablebody,tr,th,td;
staticTable=document.getElementById("divTest");
table = document.createElement("table");
tablehead = document.createElement("thead");
tablebody = document.createElement("tbody");
//Appending Table Header
tr = document.createElement("tr");
th = document.createElement("th");
th.textContent = "slNo";
tr.appendChild(th);
th = document.createElement("th");
th.textContent = "Name";
tr.appendChild(th);
tablehead.appendChild(tr);
table.appendChild(tablehead);
//Appending Table Body
tr = document.createElement("tr");
td = document.createElement("td");
td.textContent = "1";
tr.appendChild(td);
td = document.createElement("td");
td.textContent = "Demo 1";
tr.appendChild(td);
tablebody.appendChild(tr);
table.appendChild(tablebody);
//Appending Table to Div
staticTable.appendChild(table);
},
readTable : function(component, event, helper) {
//Read table rows
var staticTableDOM=document.getElementById('divTest').getElementsByTagName('table')[0];
console.log('*** Table ***');
console.log(staticTableDOM);
console.log('*** Table Rows ***');
console.log(staticTableDOM.rows);
console.log('*** Table 1st Row cells ***');
console.log(staticTableDOM.rows[0].cells);
}
})