When using Firefox, Opera, Brave browsers user setup page redirects to non-existing URL s second after the page is loaded.

The issue does not happen when Session Settings -> Visualforce Clickjack Protection is disabled.

While Opera and Brave are not officially supported, I assume Firefox should be able to view User Setup page.

 

Hi, I am a Mac user. When I open a user detail page, it loads fine for a couple of seconds and then, suddenly, I am getting "URL No Longer Exists" error in Firefox, Opera and Brave. I know that Salesforce officially does not support Opera or Brave, but since they are using Chromium I expect it to work just fine. Also, my colleague is using Brave and can view user detail page with no issues. This issue does not happen in Chrome, Edge and Safari.



I tried resetting browsers and changing some cross-site cookies flags with no luck.

Lightning and classic both behave the same way.

Disabling the "Enable clickjack protection for customer Visualforce pages with headers disabled" in session settings fixes the problem, however, I am looking for some fix in the browser (Firefox, Opera, Brave), since we are an external consulting company for a big client and they must have enabled it for a reason.

Any help would be appreciated!

I need to apply "width:100%" to "article" element inside "lightning-card"

Nothing seem to work, please help.
 

<template>
    <lightning-card  title="Test" icon-name="action:share_poll" style="display:flex; height: 100%;">

        <lightning-datatable
                key-field="id"
                data={data}
                columns={columns}
                hide-checkbox-column>
        </lightning-datatable>

    </lightning-card>
</template>

​​​

 

I can use cellAttributes: { alignment: 'center' } for the DataTable column, but I feel like there should be a better way. The issue is not hapenning on Mac, Windows only.

If accessibility.js loaded (LWC js v1), menu is not opening in LWC.

In LWC v2 accessibility.js is not loaded, and the menu opens, however, it has redundant spacing, view table and full screen features are not working.


Both versions are missing highlights below the graph in LWC.


LWC html:

<template>
    <div id="container" lwc:dom="manual"></div>
</template>

LWC v1 js:

import { LightningElement } from 'lwc';
import { loadScript } from 'lightning/platformResourceLoader';
//import jQuery from "@salesforce/resourceUrl/dftlytime__jquery2_2_4";
//import jQuery from "@salesforce/resourceUrl/APXTConga4__jQuery";
import jQuery from "@salesforce/resourceUrl/jQuery_3_5_1_min";


import highchartsResource from "@salesforce/resourceUrl/Highcharts_8_1_0";


export default class HighchartsDynamic extends LightningElement {



    renderedCallback() {

        loadScript(this, highchartsResource + "/highcharts.js")
        .then(() => {
            console.log("SUCCESS: highcharts.js");

            loadScript(this, highchartsResource + "/modules/exporting.js")
            .then(() => {
                console.log("SUCCESS: exporting.js");

                loadScript(this, highchartsResource + "/modules/export-data.js")
                .then(() => {
                    console.log("SUCCESS: export-data.js");

                    loadScript(this, highchartsResource + "/modules/accessibility.js")
                    .then(() => {
                        console.log("SUCCESS: accessibility.js");
                        this.runHighcharts();
                    })
                    .catch(error => console.log("ERROR: accessibility.js"));
                })
                .catch(error => console.log("ERROR: export-data.js"));
                
            })
            .catch(error => console.log("ERROR: exporting.js"));
        })
        .catch(error => console.log("ERROR: highcharts.js"));

    }


    runHighcharts() {

        const containerElement = this.template.querySelector('div');


        Highcharts.chart(containerElement, 


            // PIE CHART EXAMPLE
            {
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares in January, 2018'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                accessibility: {
                    point: {
                        valueSuffix: '%'
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        }
                    }
                },
                series: [{
                    name: 'Brands',
                    colorByPoint: true,
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            }

        );
      }
}

LWC v2 js:

import { LightningElement } from 'lwc';
import { loadScript } from 'lightning/platformResourceLoader';
//import jQuery from "@salesforce/resourceUrl/dftlytime__jquery2_2_4";
//import jQuery from "@salesforce/resourceUrl/APXTConga4__jQuery";
import jQuery from "@salesforce/resourceUrl/jQuery_3_5_1_min";


import highchartsResource from "@salesforce/resourceUrl/Highcharts_8_1_0";


export default class HighchartsDynamic extends LightningElement {



    renderedCallback() {

        loadScript(this, highchartsResource + "/highcharts.js")
        .then(() => {
            console.log("SUCCESS: highcharts.js");

            loadScript(this, highchartsResource + "/modules/exporting.js")
            .then(() => {
                console.log("SUCCESS: exporting.js");

                loadScript(this, highchartsResource + "/modules/export-data.js")
                .then(() => {
                    console.log("SUCCESS: export-data.js");
                    this.runHighcharts();
                    // loadScript(this, highchartsResource + "/modules/accessibility.js")
                    // .then(() => {
                    //     console.log("SUCCESS: accessibility.js");
                    //     this.runHighcharts();
                    // })
                    // .catch(error => console.log("ERROR: accessibility.js"));
                })
                .catch(error => console.log("ERROR: export-data.js"));
                
            })
            .catch(error => console.log("ERROR: exporting.js"));
        })
        .catch(error => console.log("ERROR: highcharts.js"));

    }


    runHighcharts() {

        const containerElement = this.template.querySelector('div');


        Highcharts.chart(containerElement, 


            // PIE CHART EXAMPLE
            {
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares in January, 2018'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                accessibility: {
                    point: {
                        valueSuffix: '%'
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        }
                    }
                },
                series: [{
                    name: 'Brands',
                    colorByPoint: true,
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            }

        );
      }
}

LWC Screenshot:





Perfectly Working VFP:

<apex:page >
    
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/highcharts.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/modules/exporting.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/modules/export-data.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/modules/accessibility.js')}"/>
    
    
    
    <apex:form >
        
        
        <div id="wrapper">
            <div id="container"></div>
        </div>
        
        
        <script>
        window.onload = function () {
            init();
        }  
        
        function init () {
            var divId = document.getElementById('wrapper');
            console.log(divId);
            Highcharts.chart('container',{
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Invoice Statuses Report'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        },showInLegend: true
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Invoice Chart',
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            });
        }
        </script>
    </apex:form>



    <style>
    .highcharts-figure, .highcharts-data-table table {
        min-width: 320px; 
        max-width: 800px;
        margin: 1em auto;
    }

    .highcharts-data-table table {
        font-family: Verdana, sans-serif;
        border-collapse: collapse;
        border: 1px solid #EBEBEB;
        margin: 10px auto;
        text-align: center;
        width: 100%;
        max-width: 500px;
    }
    .highcharts-data-table caption {
        padding: 1em 0;
        font-size: 1.2em;
        color: #555;
    }
    .highcharts-data-table th {
        font-weight: 600;
        padding: 0.5em;
    }
    .highcharts-data-table td, .highcharts-data-table th, .highcharts-data-table caption {
        padding: 0.5em;
    }
    .highcharts-data-table thead tr, .highcharts-data-table tr:nth-child(even) {
        background: #f8f8f8;
    }
    .highcharts-data-table tr:hover {
        background: #f1f7ff;
    }


    input[type="number"] {
        min-width: 50px;
    }
    </style>
</apex:page>

VFP Screenshot:

I cannot load static resource "exporting.js" for Highcharts in LWC. Same static resource works fine in VFP. Please help.

Downloaded Highcharts js files here:
https://www.highcharts.com/blog/download/

My ZIP static resource contents:
ROOT:
highcharts.js
highcharts.js.map
highcharts.src.js
modules - foder

modules:
accessibility.js
accessibility.js.map
accessibility.src.js
export-data.js
export-data.js.map
export-data.src.js
exporting.js
exporting.js.map
exporting.src.js







LWC.html:

<template>
    <div id="container" lwc:dom="manual"></div>
</template>

LWC.js:

import { LightningElement } from 'lwc';
import { loadScript } from 'lightning/platformResourceLoader';
import highchartsResource from "@salesforce/resourceUrl/Highcharts_8_1_0";


export default class HighchartsDynamic extends LightningElement {



    renderedCallback() {
        Promise.all([
            loadScript(this, highchartsResource + "/highcharts.js")
            .then(() => console.log("SUCCESS: highcharts.js"))
            .catch(error => console.log("ERROR: highcharts.js")),

            loadScript(this, highchartsResource + "/modules/exporting.js")
            .then(() => console.log("SUCCESS: exporting.js"))
            .catch(error => console.log("ERROR: exporting.js")),

            loadScript(this, highchartsResource + "/modules/export-data.js")
            .then(() => console.log("SUCCESS: export-data.js"))
            .catch(error => console.log("ERROR: export-data.js")),

            loadScript(this, highchartsResource + "/modules/accessibility.js")
            .then(() => console.log("SUCCESS: accessibility.js"))
            .catch(error => console.log("ERROR: accessibility.js"))
        ])
        .then(() => {
            this.runHighcharts();
        })
        .catch(error => {
            window.console.log("The error is: " + error);
        });

    }


    runHighcharts() {

        const containerId = this.template.querySelector('div').id;

        console.log('containerId: ',containerId);


        Highcharts.chart(this.template.querySelector('div'), 


            // PIE CHART EXAMPLE
            {
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares in January, 2018'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                accessibility: {
                    point: {
                        valueSuffix: '%'
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        }
                    }
                },
                series: [{
                    name: 'Brands',
                    colorByPoint: true,
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            }

        );
      }
}

VFP:

<apex:page >
    
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/highcharts.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/modules/exporting.js')}"/>
    
    
    
    <apex:form >
        
        
        <div id="wrapper">
            <div id="container"></div>
        </div>
        
        
        <script>
        window.onload = function () {
            init();
        }  
        
        function init () {
            var divId = document.getElementById('wrapper');
            console.log(divId);
            Highcharts.chart('container',{
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Invoice Statuses Report'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        },showInLegend: true
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Invoice Chart',
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            });
        }
        </script>
    </apex:form>
</apex:page>

 

I have a problem with nested iteration elements in LWC. It is duplicating a column from a parent row instead of displaying what is needed.

In order to reproduce the problem create a test Lightning App and drop testLWC component on it. When "Test" button is clicked a new row is generated in a table, however, the "Upload" button in column 3 is not supposed to be there.


testLWC.html:

<template>

    <div class="slds-box">
        <lightning-card  title="Test Component" icon-name="standard:file">
            <lightning-button label="Test" onclick={testFunction} slot="actions"></lightning-button>


            <table class="slds-table slds-table_cell-buffer slds-table_header-hidden slds-table_bordered">
                <tbody>
                    <template for:each={sections} for:item="section" for:index="indexParent">
                        <tr key={section.index}>
                            <td>
                                {section.Name}
                            </td>
                            <td>
                                col 2
                            </td>
                            <td>
                                <lightning-button label="Upload" onclick={testFunction} ></lightning-button>
                            </td>
                            <td>
                                col 4
                            </td>
                        </tr>
                        <template for:each={section.rowList} for:item="row" for:index="indexChild">
                            <tr key={row.index}>
                                <td>
                                    {row.Name}
                                </td>
                                <td>
                                    child col 2
                                </td>
                                <td>
                                    child col 4
                                </td>
                                <td>
                                    child col 4
                                </td>
                            </tr>
                        </template>
                    </template>
                </tbody>
            </table>
            
        </lightning-card>
    </div>
</template>

testLWC.js:

import { LightningElement, track } from 'lwc';

export default class TestLWC extends LightningElement {

    @track sections =   [
                        {Name:"Section 1", rowList:[]} //{Name:"Row 1"},{Name:"Row 2"},{Name:"Row 3"}
                        ,{Name:"Section 1", rowList:[]}
                        ]; //{Name:"Row 1"},{Name:"Row 2"},{Name:"Row 3"}]}

    connectedCallback(){
        // default logic
    }

    testFunction(){
        this.sections[0].rowList.push({Name:'Test'});
    }

}

Before Click:
After Click:

I have a publicly available page through salesforce sites. It was working before our sandbox got upgraded to Spring 2020 release. In order to replicate the problem a salesforce site needs to be created. The LWC will be embedded within salesforce site VFP.

I gave the external user access to Case object (read/edit) and visibility of fields to be displayed.

I get identical issue with aura component "lightning:recordEditForm" and LWC "lightning-record-edit-form".

I could replace the lightning-record-edit-form with input fields, however, it makes things complicated with dependent picklists.


VFP:

<apex:page standardStylesheets="false" applyBodyTag="false" sidebar="false" showHeader="false">
    <apex:includeLightning />
    <div id="container"></div>
    
    <script>
    $Lightning.use("c:Site_LWC_Viewer_App", function()
    {
        $Lightning.createComponent(
            "c:testLWC",
            {'greeting':'Somnath'},
            "container",
            function(cmp)
        {
            console.log('component created');
        });
    });
    </script>
</apex:page>

AURA APP - "Site_LWC_Viewer_App":

<aura:application extends="ltng:outApp" access="GLOBAL" implements="ltng:allowGuestAccess">
</aura:application>

LWC - "testLWC":

<template>
    <lightning-record-edit-form object-api-name="Case">
        <lightning-messages></lightning-messages>

        <lightning-input-field field-name="Subject"></lightning-input-field>
        
        <lightning-button   class="slds-m-top_small"
                            type="submit"
                            label="Create new">
        </lightning-button>
    </lightning-record-edit-form>
</template>

​​​​​​​ERROR:

I am working on a lookup field component. This component will receive a record ID attribute and when ID is changed will query for the record Name.

While working on the lookup field, I found out that the 'aura:handler name="change"...' will execute twice, if used on the child lightning component and the attribute is dynamically updateable from the parent component.

Please see the sample components below. When Neutral button is clicked, the change event is triggered twice.

CMP Screenshot with console logs:


Parent CMP:

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes">
         <aura:attribute name="value" type="String"/>
         <c:TestChangeEvent value="{!v.value}"/>
</aura:component>

TestChangeEvent CMP:​​​​​​​

<aura:component controller="Field_Lookup_Ctr">
 
    <aura:attribute name="value" type="String"/>
   
    <aura:handler name="change" value="{!v.value}" action="{!c.valueUpdate}"/>
   
    <lightning:button label="Neutral" title="Neutral action" onclick="{!c.updateAttribute}"/>
   
</aura:component>

TestChangeEvent  CONTROLLER:

({
   
    updateAttribute : function (component, event, helper) {
        component.set('v.value','12345');
    },
    valueUpdate : function (component, event, helper) {
        console.log('valueUpdate()');
    }
   
})

QUESTION:
Can I pause the "Change Event" or make sure it is executed only once, without too much effort?​​​​​​​

I am working on a visualforce page using SLDS and static resoueces javascript file. I have eclipse crahing every day at least once when I am working on the static resource JS file. Usually it happens after 3 hours of compiling the file. This is very annoyong and I need to refresh the whole project after it crashes as well as find the line of code I was working with. Please help. My guess is this is some network settings.


Force.com IDE Log:

WARN [2018-05-24 11:46:44,337] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 11:57:41,469] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 11:58:08,945] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:00:09,886] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:00:20,261] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:01:15,540] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:02:22,877] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:06:04,383] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:06:42,530] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:07:33,479] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:11:39,764] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:11:50,170] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:12:40,367] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [3] does not equal request count [2].
 WARN [2018-05-24 12:14:53,326] (BuilderPayload.java:filterComponentsInConflict:256) - Remote retrieve result count [59] does not equal request count [84].
 WARN [2018-05-24 12:14:53,420] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridAdminScript.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,422] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridDetailStyleCSS.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,427] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridJs.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,431] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridJs2_Backup.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,433] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridPdfMake.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,436] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridPdfMake_Backup.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,438] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/CompGridScript_Backup.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,443] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/ContractRequestScript.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,445] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/ContractRequestStyle.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,446] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/SLDS222.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,449] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/Typeahead.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,454] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/aljs.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,461] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/aljswithmomentScript.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,464] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/bootstrap.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,466] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/bootstrap_js.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,468] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/bootstrap_theme.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,483] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/datatable_zip.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,485] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/jquery_blockUI_js.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,492] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/jquery_min_js.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,495] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/pasteIcon_png.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,544] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/pdfmake.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,546] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/responsive_tables.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,548] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/responsive_tables_css.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,550] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/tableGrid_css.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,552] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/tableGrid_js.resource' - skipping duplicate
 WARN [2018-05-24 12:14:53,612] (ZipUtils.java:handleDuplicateEntryException:261) - Zip already contains 'staticresources/vfs_fonts.resource' - skipping duplicate

 

SelectList put in table or repeat visualforce elements causes all controller methods to break. No errors are shown, however, the debug statements for methods that are called from the page are not showing. No javascript errors either.

When select list is substituted with any other element the row is successfuly added to the table, but when SelectList is there and it is not blank the new row is not added as well as other butons do not work on the page.

VFP:

<apex:page controller="Test_Ctr">
    <apex:form id="theForm">
        <apex:pageBlock title="Filters">
            <apex:pageBlockButtons location="bottom">
                <apex:commandButton action="{!newFilter}" value="New Filter" rerender="theForm"/>
                <apex:commandButton action="{!testValues}" value="Test Values" rerender="theForm"/>
            </apex:pageBlockButtons>
            
            <apex:pageBlockTable value="{!ftsWrap}" var="row">
                <apex:column> 
                    <!--apex:selectList value="{!row.fieldvar}" size="1">
                        <apex:selectOptions value="{!listOptions}"/>
                    </apex:selectList-->
                    <apex:selectList value="{!row.fieldvar}" size="1" >
                        <apex:actionSupport event="onchange" reRender="theForm"/>
                        <apex:selectOptions value="{!listOptions}"></apex:selectOptions>
                    </apex:selectList>
                </apex:column>
            </apex:pageBlockTable>
            
            
        </apex:pageBlock>
    </apex:form>
</apex:page>

CTR:

public with sharing class Test_Ctr {
    
    
    public List <filtersWrap> ftsWrap {get;set;}
    public List <SelectOption> listOptions {get;set;}
    
    
    public Test_Ctr(){
        System.debug('*****Test_Ctr()');
        
        ftsWrap = new List <filtersWrap> ();
        //filtersWrap fw = new filtersWrap();
        //ftsWrap.add(fw);
        newFilter();
        
        listOptions = objectFieldsGetter();
        System.debug('ftsWrap: '+ftsWrap);
    }
    
    
    public List<SelectOption> objectFieldsGetter() 
    {
        String selectedObject = 'Task';
        
        Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
        Schema.SObjectType ObjectSchema = schemaMap.get(selectedObject);
        Map<String, Schema.SObjectField> fieldMap = ObjectSchema.getDescribe().fields.getMap();
        List<SelectOption> fieldNames = new List<SelectOption>();
        for (String fieldName: fieldMap.keySet()) 
        {  
            fieldNames.add(new SelectOption(fieldName,fieldName));
        }
        return fieldNames;
    }
    
    
    public class filtersWrap{
        public SelectOption fieldvar {get;set;}
        //public List <SelectOption> fields {get;set;}
    }
    
    
    public void newFilter(){
        System.debug('*******newFilter()');
        filtersWrap fw = new filtersWrap();
        //fw.fields = objectFieldsGetter();
        
        System.debug('fw: '+fw);
        System.debug('ftsWrap: '+ftsWrap);
        ftsWrap.add(fw);
        
        
        System.debug('ftsWrap: '+ftsWrap);
    }
    
    public void testValues(){
        System.debug('*******testValues()');
        System.debug('ftsWrap: '+ftsWrap);
    }
    
}

I have a visualforce page, that implemnts lightningStyleSheets="true" and has apex:tabPanel with multiple tabs. When user is in Lightnig Experience and any button is pressed on the same page, which causes a component rerendering, tabs styling changes to classic.

VF PAGE:

<apex:page controller="PracticeCompGrid_Cont" showHeader="true" lightningStylesheets="true">
            
    <!-- Create Tab panel -->
    <apex:tabPanel switchType="client" selectedTab="name2" id="AccountTabPanel"
        tabClass="activeTab" inactiveTabClass="inactiveTab">
        <apex:tab label="One" name="name1" id="tabOne">content for tab one</apex:tab>
        <apex:tab label="Two" name="name2" id="tabTwo">
                            
            <apex:pageBlock id="pbId">

                <apex:pageBlockButtons >
                    <apex:form >
                        <apex:commandButton action="{!debugFun}" rerender="pbId" value="Test" />
                    </apex:form>
                </apex:pageBlockButtons>
                <apex:pageBlockTable value="{!accList}" var="a">
                    <apex:column value="{!a.Name}" />
                </apex:pageBlockTable>
            </apex:pageBlock>
        </apex:tab>
    </apex:tabPanel>
</apex:page>

CONTROLLER:

public class PracticeCompGrid_Cont {

    public List <Account> accList {get;set;}
    
    public PracticeCompGrid_Cont (){
        accList = [SELECT Name FROM Account LIMIT 10];
    }
    
    public void debugFun(){
        System.debug('Acc: '+accList);
    }
}

BEFORE BUTTON IS PRESSED:

AFTER BUTTON IS PRESSED AND RERENDER HAPPENED:




Has anyone seen this before? If yes, any solutions?

I need to apply "width:100%" to "article" element inside "lightning-card"

Nothing seem to work, please help.
 

<template>
    <lightning-card  title="Test" icon-name="action:share_poll" style="display:flex; height: 100%;">

        <lightning-datatable
                key-field="id"
                data={data}
                columns={columns}
                hide-checkbox-column>
        </lightning-datatable>

    </lightning-card>
</template>

​​​

 

I have a visualforce page, that implemnts lightningStyleSheets="true" and has apex:tabPanel with multiple tabs. When user is in Lightnig Experience and any button is pressed on the same page, which causes a component rerendering, tabs styling changes to classic.

VF PAGE:

<apex:page controller="PracticeCompGrid_Cont" showHeader="true" lightningStylesheets="true">
            
    <!-- Create Tab panel -->
    <apex:tabPanel switchType="client" selectedTab="name2" id="AccountTabPanel"
        tabClass="activeTab" inactiveTabClass="inactiveTab">
        <apex:tab label="One" name="name1" id="tabOne">content for tab one</apex:tab>
        <apex:tab label="Two" name="name2" id="tabTwo">
                            
            <apex:pageBlock id="pbId">

                <apex:pageBlockButtons >
                    <apex:form >
                        <apex:commandButton action="{!debugFun}" rerender="pbId" value="Test" />
                    </apex:form>
                </apex:pageBlockButtons>
                <apex:pageBlockTable value="{!accList}" var="a">
                    <apex:column value="{!a.Name}" />
                </apex:pageBlockTable>
            </apex:pageBlock>
        </apex:tab>
    </apex:tabPanel>
</apex:page>

CONTROLLER:

public class PracticeCompGrid_Cont {

    public List <Account> accList {get;set;}
    
    public PracticeCompGrid_Cont (){
        accList = [SELECT Name FROM Account LIMIT 10];
    }
    
    public void debugFun(){
        System.debug('Acc: '+accList);
    }
}

BEFORE BUTTON IS PRESSED:

AFTER BUTTON IS PRESSED AND RERENDER HAPPENED:




Has anyone seen this before? If yes, any solutions?

When using Firefox, Opera, Brave browsers user setup page redirects to non-existing URL s second after the page is loaded.

The issue does not happen when Session Settings -> Visualforce Clickjack Protection is disabled.

While Opera and Brave are not officially supported, I assume Firefox should be able to view User Setup page.

 

I cannot load static resource "exporting.js" for Highcharts in LWC. Same static resource works fine in VFP. Please help.

Downloaded Highcharts js files here:
https://www.highcharts.com/blog/download/

My ZIP static resource contents:
ROOT:
highcharts.js
highcharts.js.map
highcharts.src.js
modules - foder

modules:
accessibility.js
accessibility.js.map
accessibility.src.js
export-data.js
export-data.js.map
export-data.src.js
exporting.js
exporting.js.map
exporting.src.js







LWC.html:

<template>
    <div id="container" lwc:dom="manual"></div>
</template>

LWC.js:

import { LightningElement } from 'lwc';
import { loadScript } from 'lightning/platformResourceLoader';
import highchartsResource from "@salesforce/resourceUrl/Highcharts_8_1_0";


export default class HighchartsDynamic extends LightningElement {



    renderedCallback() {
        Promise.all([
            loadScript(this, highchartsResource + "/highcharts.js")
            .then(() => console.log("SUCCESS: highcharts.js"))
            .catch(error => console.log("ERROR: highcharts.js")),

            loadScript(this, highchartsResource + "/modules/exporting.js")
            .then(() => console.log("SUCCESS: exporting.js"))
            .catch(error => console.log("ERROR: exporting.js")),

            loadScript(this, highchartsResource + "/modules/export-data.js")
            .then(() => console.log("SUCCESS: export-data.js"))
            .catch(error => console.log("ERROR: export-data.js")),

            loadScript(this, highchartsResource + "/modules/accessibility.js")
            .then(() => console.log("SUCCESS: accessibility.js"))
            .catch(error => console.log("ERROR: accessibility.js"))
        ])
        .then(() => {
            this.runHighcharts();
        })
        .catch(error => {
            window.console.log("The error is: " + error);
        });

    }


    runHighcharts() {

        const containerId = this.template.querySelector('div').id;

        console.log('containerId: ',containerId);


        Highcharts.chart(this.template.querySelector('div'), 


            // PIE CHART EXAMPLE
            {
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false,
                    type: 'pie'
                },
                title: {
                    text: 'Browser market shares in January, 2018'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                accessibility: {
                    point: {
                        valueSuffix: '%'
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        }
                    }
                },
                series: [{
                    name: 'Brands',
                    colorByPoint: true,
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            }

        );
      }
}

VFP:

<apex:page >
    
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/highcharts.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Highcharts_8_1_0, '/modules/exporting.js')}"/>
    
    
    
    <apex:form >
        
        
        <div id="wrapper">
            <div id="container"></div>
        </div>
        
        
        <script>
        window.onload = function () {
            init();
        }  
        
        function init () {
            var divId = document.getElementById('wrapper');
            console.log(divId);
            Highcharts.chart('container',{
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Invoice Statuses Report'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                        },showInLegend: true
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Invoice Chart',
                    data: [{
                        name: 'Chrome',
                        y: 61.41,
                        sliced: true,
                        selected: true
                    }, {
                        name: 'Internet Explorer',
                        y: 11.84
                    }, {
                        name: 'Firefox',
                        y: 10.85
                    }, {
                        name: 'Edge',
                        y: 4.67
                    }, {
                        name: 'Safari',
                        y: 4.18
                    }, {
                        name: 'Sogou Explorer',
                        y: 1.64
                    }, {
                        name: 'Opera',
                        y: 1.6
                    }, {
                        name: 'QQ',
                        y: 1.2
                    }, {
                        name: 'Other',
                        y: 2.61
                    }]
                }]
            });
        }
        </script>
    </apex:form>
</apex:page>

 

I have a problem with nested iteration elements in LWC. It is duplicating a column from a parent row instead of displaying what is needed.

In order to reproduce the problem create a test Lightning App and drop testLWC component on it. When "Test" button is clicked a new row is generated in a table, however, the "Upload" button in column 3 is not supposed to be there.


testLWC.html:

<template>

    <div class="slds-box">
        <lightning-card  title="Test Component" icon-name="standard:file">
            <lightning-button label="Test" onclick={testFunction} slot="actions"></lightning-button>


            <table class="slds-table slds-table_cell-buffer slds-table_header-hidden slds-table_bordered">
                <tbody>
                    <template for:each={sections} for:item="section" for:index="indexParent">
                        <tr key={section.index}>
                            <td>
                                {section.Name}
                            </td>
                            <td>
                                col 2
                            </td>
                            <td>
                                <lightning-button label="Upload" onclick={testFunction} ></lightning-button>
                            </td>
                            <td>
                                col 4
                            </td>
                        </tr>
                        <template for:each={section.rowList} for:item="row" for:index="indexChild">
                            <tr key={row.index}>
                                <td>
                                    {row.Name}
                                </td>
                                <td>
                                    child col 2
                                </td>
                                <td>
                                    child col 4
                                </td>
                                <td>
                                    child col 4
                                </td>
                            </tr>
                        </template>
                    </template>
                </tbody>
            </table>
            
        </lightning-card>
    </div>
</template>

testLWC.js:

import { LightningElement, track } from 'lwc';

export default class TestLWC extends LightningElement {

    @track sections =   [
                        {Name:"Section 1", rowList:[]} //{Name:"Row 1"},{Name:"Row 2"},{Name:"Row 3"}
                        ,{Name:"Section 1", rowList:[]}
                        ]; //{Name:"Row 1"},{Name:"Row 2"},{Name:"Row 3"}]}

    connectedCallback(){
        // default logic
    }

    testFunction(){
        this.sections[0].rowList.push({Name:'Test'});
    }

}

Before Click:
After Click:

I have a publicly available page through salesforce sites. It was working before our sandbox got upgraded to Spring 2020 release. In order to replicate the problem a salesforce site needs to be created. The LWC will be embedded within salesforce site VFP.

I gave the external user access to Case object (read/edit) and visibility of fields to be displayed.

I get identical issue with aura component "lightning:recordEditForm" and LWC "lightning-record-edit-form".

I could replace the lightning-record-edit-form with input fields, however, it makes things complicated with dependent picklists.


VFP:

<apex:page standardStylesheets="false" applyBodyTag="false" sidebar="false" showHeader="false">
    <apex:includeLightning />
    <div id="container"></div>
    
    <script>
    $Lightning.use("c:Site_LWC_Viewer_App", function()
    {
        $Lightning.createComponent(
            "c:testLWC",
            {'greeting':'Somnath'},
            "container",
            function(cmp)
        {
            console.log('component created');
        });
    });
    </script>
</apex:page>

AURA APP - "Site_LWC_Viewer_App":

<aura:application extends="ltng:outApp" access="GLOBAL" implements="ltng:allowGuestAccess">
</aura:application>

LWC - "testLWC":

<template>
    <lightning-record-edit-form object-api-name="Case">
        <lightning-messages></lightning-messages>

        <lightning-input-field field-name="Subject"></lightning-input-field>
        
        <lightning-button   class="slds-m-top_small"
                            type="submit"
                            label="Create new">
        </lightning-button>
    </lightning-record-edit-form>
</template>

​​​​​​​ERROR:

SelectList put in table or repeat visualforce elements causes all controller methods to break. No errors are shown, however, the debug statements for methods that are called from the page are not showing. No javascript errors either.

When select list is substituted with any other element the row is successfuly added to the table, but when SelectList is there and it is not blank the new row is not added as well as other butons do not work on the page.

VFP:

<apex:page controller="Test_Ctr">
    <apex:form id="theForm">
        <apex:pageBlock title="Filters">
            <apex:pageBlockButtons location="bottom">
                <apex:commandButton action="{!newFilter}" value="New Filter" rerender="theForm"/>
                <apex:commandButton action="{!testValues}" value="Test Values" rerender="theForm"/>
            </apex:pageBlockButtons>
            
            <apex:pageBlockTable value="{!ftsWrap}" var="row">
                <apex:column> 
                    <!--apex:selectList value="{!row.fieldvar}" size="1">
                        <apex:selectOptions value="{!listOptions}"/>
                    </apex:selectList-->
                    <apex:selectList value="{!row.fieldvar}" size="1" >
                        <apex:actionSupport event="onchange" reRender="theForm"/>
                        <apex:selectOptions value="{!listOptions}"></apex:selectOptions>
                    </apex:selectList>
                </apex:column>
            </apex:pageBlockTable>
            
            
        </apex:pageBlock>
    </apex:form>
</apex:page>

CTR:

public with sharing class Test_Ctr {
    
    
    public List <filtersWrap> ftsWrap {get;set;}
    public List <SelectOption> listOptions {get;set;}
    
    
    public Test_Ctr(){
        System.debug('*****Test_Ctr()');
        
        ftsWrap = new List <filtersWrap> ();
        //filtersWrap fw = new filtersWrap();
        //ftsWrap.add(fw);
        newFilter();
        
        listOptions = objectFieldsGetter();
        System.debug('ftsWrap: '+ftsWrap);
    }
    
    
    public List<SelectOption> objectFieldsGetter() 
    {
        String selectedObject = 'Task';
        
        Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
        Schema.SObjectType ObjectSchema = schemaMap.get(selectedObject);
        Map<String, Schema.SObjectField> fieldMap = ObjectSchema.getDescribe().fields.getMap();
        List<SelectOption> fieldNames = new List<SelectOption>();
        for (String fieldName: fieldMap.keySet()) 
        {  
            fieldNames.add(new SelectOption(fieldName,fieldName));
        }
        return fieldNames;
    }
    
    
    public class filtersWrap{
        public SelectOption fieldvar {get;set;}
        //public List <SelectOption> fields {get;set;}
    }
    
    
    public void newFilter(){
        System.debug('*******newFilter()');
        filtersWrap fw = new filtersWrap();
        //fw.fields = objectFieldsGetter();
        
        System.debug('fw: '+fw);
        System.debug('ftsWrap: '+ftsWrap);
        ftsWrap.add(fw);
        
        
        System.debug('ftsWrap: '+ftsWrap);
    }
    
    public void testValues(){
        System.debug('*******testValues()');
        System.debug('ftsWrap: '+ftsWrap);
    }
    
}

I have a visualforce page, that implemnts lightningStyleSheets="true" and has apex:tabPanel with multiple tabs. When user is in Lightnig Experience and any button is pressed on the same page, which causes a component rerendering, tabs styling changes to classic.

VF PAGE:

<apex:page controller="PracticeCompGrid_Cont" showHeader="true" lightningStylesheets="true">
            
    <!-- Create Tab panel -->
    <apex:tabPanel switchType="client" selectedTab="name2" id="AccountTabPanel"
        tabClass="activeTab" inactiveTabClass="inactiveTab">
        <apex:tab label="One" name="name1" id="tabOne">content for tab one</apex:tab>
        <apex:tab label="Two" name="name2" id="tabTwo">
                            
            <apex:pageBlock id="pbId">

                <apex:pageBlockButtons >
                    <apex:form >
                        <apex:commandButton action="{!debugFun}" rerender="pbId" value="Test" />
                    </apex:form>
                </apex:pageBlockButtons>
                <apex:pageBlockTable value="{!accList}" var="a">
                    <apex:column value="{!a.Name}" />
                </apex:pageBlockTable>
            </apex:pageBlock>
        </apex:tab>
    </apex:tabPanel>
</apex:page>

CONTROLLER:

public class PracticeCompGrid_Cont {

    public List <Account> accList {get;set;}
    
    public PracticeCompGrid_Cont (){
        accList = [SELECT Name FROM Account LIMIT 10];
    }
    
    public void debugFun(){
        System.debug('Acc: '+accList);
    }
}

BEFORE BUTTON IS PRESSED:

AFTER BUTTON IS PRESSED AND RERENDER HAPPENED:




Has anyone seen this before? If yes, any solutions?

I was solving this challenge and my VF code is:

<apex:page standardController="Account" recordSetVar="Accounts" >
    <apex:pageblock>
        <apex:repeat var="a" value="{!Accounts}" rendered="true"  id="account_list">
            <li>
                <apex:outputLink value="https://ap1.salesforce.com/{!a.ID}" >
                    <apex:outputText value="{!a.Name}"/>
                </apex:outputLink>
            </li>
        </apex:repeat>
    </apex:pageblock>
</apex:page>

I am getting the list of accounts as required and on clicking on any of the accouts, it redirects to that accounts detail page.
Still I am getting following error from trailhead:

"The page does not bind to the record ID value (in order to link to the record detail page)"