Hi,

How should we test that an element received focus.
In the js controller we are testing we used:

const button  = this.template.queryselector('xxx');
button.focus()

We know this works because it been tested through the UI ie. the focus box shows around the button.

I have tried a few things in Jest not nothign seems to work:

- Use jest-dom:
 

expect(button).toHaveFocus()

But only the top parent is returned by toHaveFocus().

I tested it in the smallest example possible and it just doesn't work.
- Use document.activeElement
that returns :
 

HTMLBridgeElement [HTMLElement] {}

I don't even understand what this could be, and Google doesn't seem to know either.
My gut feeling tells me that LockerService is preventing the use of document.activeElement, which is used under the hood  by jest-dom toHaveFocus().
But in the end I don't know how to test focus at all
Any idea?

I am using UTAM to test an LWC app on Experience cloud site (Community)
I managed to test everything but I am struggling to test a selection of an input type=radio.
I tried to set it as "type": "clickable":
 

"name": "radioFalse",
                "public": true,
                "type": "clickable",
                "selector": {
                    "css": "input[type='radio'][value='No']"  
                }

But I get a :
"Request failed with status 400 due to element not interactable"
when I try to execute a .click() on it.

I also tried to change it to "type":"editable" and use the .press('Space') method but it did NOT select the input radio.

Any suggestion?

I have tried 3 libraries now
- datepickk: doesn't load
- FullCalendarJS: the main libray loads and works but NO plugin could be loaded so useless
- lightpick: loads but no feature works. Clicking a date doesn't work for instance

Anyone got more luck than I did?
 

I am trying to export some Javascript code and import it in another module.
Following the documentation I did this:
mortgage.js:

const getTxt = () => {
    console.log('yo getTxt');
    return 'yoyoyo';
}
export {getTxt};

in another component: (it's NOT the full code, it's just to show that I don't use this.getTxt(). I call it directly like the example in the documentation

import getTxt from 'c/mortgage';
export default class another extends LightningElement {
    this.sectionDescription = getTxt();
}

The code stops working at the line I call getTxt();
No error in the console.
My console.log code is not even called.

Any suggestion?


 

Hi,

We used to be able to do this in Aura:

String labelName = 'mylabel';
$A.getReference("$Label.c."+ labelName);

$A is not accessible in LWC

Following the documentation I can only see a way to get access to Label's value through import.
As far as I know import don't work dynamically. You can only write an import if you know the name of the label.

I was hoping for a solution involving Apex and/or SOQL but could not find anything.

Any idea?
 

Hi,

I set up a CMS connection in my Community.
I used these settings:
CMS Source: Drupal
Connection type public:
Server URL: https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com

JSON:
Content list: 
- Name: List
- Path: content/rest?_format=json
- Node Path: nothing

When using the component CMS Connect JSON with the default values I see: "The server returned code HTTP 0"

I can confirm that my Rest service is well configures by testing it with Postman or even directly in the browser:
https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com/content/rest?_format=json

Any idea of what is wrong or how I could debug that?

Can we test the CMS connection?

Cheers,
Laurent


 

I am stuck at the Trailhead: "Build a Lightning Component to Override a Standard Action" - "Use Lighting Data Service"
with the error:
"Challenge Not yet complete... here's what's wrong: The JavaScript controller markup for the 'PropertyDialog' component is not correct."
Thanks Trailhead ><
Everythign is working as expected when I test it. I passed the next modules with no issues.
I only copy pasted what they required so this looks like some other mistakes is creeping in.
PropertyDialog:

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" > <aura:attribute name="picklistValues" type="Object" /> <aura:attribute name="propertyRecord" type="Property__c" /> <force:recordData aura:id="forceRecord" recordId="{!v.recordId}" targetFields="{!v.propertyRecord}" fields="Id,Name,Beds__c,Baths__c,Price__c,Status__c" mode="EDIT" /> <aura:handler name="init" value="{!this}" action="{!c.doInit}" /> <c:PicklistValues sObjectName="Property__c" fieldName="Status__c" picklistValues="{!v.picklistValues}" /> <lightning:input aura:id="propName" name="propName" label="Property Name" required="true" /> <lightning:input aura:id="propBeds" name="propBeds" label="Beds" /> <lightning:input aura:id="propBaths" name="propBaths" label="Baths" /> <lightning:input aura:id="propPrice" name="propPrice" label="Price" /> <lightning:select aura:id="propStatus" name="propStatus" label="Status"> <aura:iteration items="{!v.picklistValues}" var="item"> <option value="{!item}">{!item}</option> </aura:iteration> </lightning:select> <lightning:button variant="neutral" label="Cancel" /> <lightning:button variant="brand" label="Submit" onclick="{!c.saveRecord}" />

PropertyDialogController:

({ doInit : function(component, event, helper) { console.log('Property Dialiog init'); var recordData = component.find("forceRecord"); recordData.getNewRecord('Property__c', null, false, $A.getCallback(function() { console.log('callback from getNewRecord'); var rec = component.get("v.propertyRecord"); var error = component.get("v.recordError"); if (error || (rec === null)) { console.log("Error initializing record template: " + error); return; } })); }, saveRecord : function(component, event, helper){ console.log('saveRecord start'); var propBeds = parseInt(component.find('propBeds').get("v.value"), 10); var propBaths = parseInt(component.find('propBaths').get("v.value"), 10); var propPrice = parseInt(component.find('propPrice').get("v.value"), 10); component.set("v.propertyRecord.Name", component.find('propName').get("v.value")); component.set("v.propertyRecord.Beds__c", propBeds); component.set("v.propertyRecord.Baths__c", propBaths); component.set("v.propertyRecord.Price__c", propPrice); component.set("v.propertyRecord.Status__c", "Listed"); console.log('finished setting fields'); var tempRec = component.find("forceRecord"); console.log(tempRec); console.log(JSON.stringify(tempRec)) ; tempRec.saveRecord($A.getCallback(function(result) { console.log(result.state); var resultsToast = $A.get("e.force:showToast"); if (result.state === "SUCCESS") { resultsToast.setParams({ "title": "Saved", "message": "The record was saved." }); resultsToast.fire(); var recId = result.recordId; console.log('record id: '+recId); helper.navigateTo(component, recId); } else if (result.state === "ERROR") { console.log('Error: ' + JSON.stringify(result.error)); resultsToast.setParams({ "title": "Error", "message": "There was an error saving the record: " + JSON.stringify(result.error) }); resultsToast.fire(); } else { console.log('Unknown problem, state: ' + result.state + ', error: ' + JSON.stringify(result.error)); } })); }
})

PropertyDialogHelper:

({ navigateTo : function(component, recId) { var eventNav = $A.get("e.force:navigateToSObject"); eventNav.setParams({recordId: recId}); eventNav.fire(); }
})

Thanks for the help!

Hi all,

I'm trying to integrate a 3rd party Javascript library in my Lightning application.
This one if you are curious:
https://github.com/szimek/signature_pad

I can include the libray and initialize it with no problem but the problem arrises when you try to access the Javascript object through a different client side method.

EX:

({
  initSignature: function(component, event, helper) {
    console.log('init');

    var canvas = component.find("signCanvas").getElement();
    var signaturePad = new SignaturePad(canvas);
  },
	saveSignature: function(component, event, helper) {
    console.log('save');
    signaturePad.toDataURL()
	},
})

I need "signaturePad" to be accessible from all my Client-side controller methods.

Is there a way to have a globally accessible var?

Cheers,
Laurent
 

HI everyone,

We are trying to create our own file upload Lightning component.
We based our approach on what Peter Knolle did:
http://peterknolle.com/file-upload-lightning-component/

(Quick summary: we upload the fill in chunks and update the Attachment body with DML because we cannot pass a String of size bigger than 6 000 000)

Our problem is that line:
a.Body = EncodingUtil.base64Decode(EncodingUtil.base64Encode(a.Body)+ base64Data);
It seems to load the existing body twice in memory, once for a.Body and once for EncodingUtil.base64Decode(...) which makes the biggest file we can upload only around 1.5MB because of the Heap Size limit.

I tried using "transient" variables to try and unload memory. 
I also tried setting some variable to null or "" after using them but the Heap Size usage stays the same.
No luck.

Any idea?

Cheers,
Laurent

Hi,


When re-rendering the parent element of a apex:map, I get this error message displayed instead of the map:
"HTTP ERROR 401  Problem accessing /maps/JavascriptHandler. Reason:      Unauthorized Powered by Jetty://".

It works fine on the first loading. Any idea?

Hi,

I am new to Salesforce1 and am currently trying the Mobile Templates, which promise to use ONLY Html and CSS to provide a mobile experience.

But of course Android doesn't support HTML5 out of the box, so appart from a nifty workaround, the template just won't work on Android.

I see the use of the Zebra library, which makes it work on Firefox, but still not on Android. When I adapt the Mobile Template page directly into a VF Tab and show on my mobile app, the date is displayed as a text input. 

I would add that sometimes only a blank page displays.

And sometimes, when I tap in the date field, the whole thing just crashes.... and I have no clue how to debug issues on salesforce1.

I tried jQuery Mobile datepicker but it's not officially supported and so far no luck.

Some people are talking about Mobiscroll but it's not free so out of the question.

Any idea?

Laurent

Hi,

How should we test that an element received focus.
In the js controller we are testing we used:

const button  = this.template.queryselector('xxx');
button.focus()

We know this works because it been tested through the UI ie. the focus box shows around the button.

I have tried a few things in Jest not nothign seems to work:

- Use jest-dom:
 

expect(button).toHaveFocus()

But only the top parent is returned by toHaveFocus().

I tested it in the smallest example possible and it just doesn't work.
- Use document.activeElement
that returns :
 

HTMLBridgeElement [HTMLElement] {}

I don't even understand what this could be, and Google doesn't seem to know either.
My gut feeling tells me that LockerService is preventing the use of document.activeElement, which is used under the hood  by jest-dom toHaveFocus().
But in the end I don't know how to test focus at all
Any idea?

Hi,

We used to be able to do this in Aura:

String labelName = 'mylabel';
$A.getReference("$Label.c."+ labelName);

$A is not accessible in LWC

Following the documentation I can only see a way to get access to Label's value through import.
As far as I know import don't work dynamically. You can only write an import if you know the name of the label.

I was hoping for a solution involving Apex and/or SOQL but could not find anything.

Any idea?
 

Hi,

I set up a CMS connection in my Community.
I used these settings:
CMS Source: Drupal
Connection type public:
Server URL: https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com

JSON:
Content list: 
- Name: List
- Path: content/rest?_format=json
- Node Path: nothing

When using the component CMS Connect JSON with the default values I see: "The server returned code HTTP 0"

I can confirm that my Rest service is well configures by testing it with Postman or even directly in the browser:
https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com/content/rest?_format=json

Any idea of what is wrong or how I could debug that?

Can we test the CMS connection?

Cheers,
Laurent


 

Hi,

I am new to Salesforce1 and am currently trying the Mobile Templates, which promise to use ONLY Html and CSS to provide a mobile experience.

But of course Android doesn't support HTML5 out of the box, so appart from a nifty workaround, the template just won't work on Android.

I see the use of the Zebra library, which makes it work on Firefox, but still not on Android. When I adapt the Mobile Template page directly into a VF Tab and show on my mobile app, the date is displayed as a text input. 

I would add that sometimes only a blank page displays.

And sometimes, when I tap in the date field, the whole thing just crashes.... and I have no clue how to debug issues on salesforce1.

I tried jQuery Mobile datepicker but it's not officially supported and so far no luck.

Some people are talking about Mobiscroll but it's not free so out of the question.

Any idea?

Laurent

Hi,

How should we test that an element received focus.
In the js controller we are testing we used:

const button  = this.template.queryselector('xxx');
button.focus()

We know this works because it been tested through the UI ie. the focus box shows around the button.

I have tried a few things in Jest not nothign seems to work:

- Use jest-dom:
 

expect(button).toHaveFocus()

But only the top parent is returned by toHaveFocus().

I tested it in the smallest example possible and it just doesn't work.
- Use document.activeElement
that returns :
 

HTMLBridgeElement [HTMLElement] {}

I don't even understand what this could be, and Google doesn't seem to know either.
My gut feeling tells me that LockerService is preventing the use of document.activeElement, which is used under the hood  by jest-dom toHaveFocus().
But in the end I don't know how to test focus at all
Any idea?

Hi,

We used to be able to do this in Aura:

String labelName = 'mylabel';
$A.getReference("$Label.c."+ labelName);

$A is not accessible in LWC

Following the documentation I can only see a way to get access to Label's value through import.
As far as I know import don't work dynamically. You can only write an import if you know the name of the label.

I was hoping for a solution involving Apex and/or SOQL but could not find anything.

Any idea?
 

Hi,

I set up a CMS connection in my Community.
I used these settings:
CMS Source: Drupal
Connection type public:
Server URL: https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com

JSON:
Content list: 
- Name: List
- Path: content/rest?_format=json
- Node Path: nothing

When using the component CMS Connect JSON with the default values I see: "The server returned code HTTP 0"

I can confirm that my Rest service is well configures by testing it with Postman or even directly in the browser:
https://drupdemoeight8wnpr4ekpl.devcloud.acquia-sites.com/content/rest?_format=json

Any idea of what is wrong or how I could debug that?

Can we test the CMS connection?

Cheers,
Laurent


 

Hi all,

I'm trying to integrate a 3rd party Javascript library in my Lightning application.
This one if you are curious:
https://github.com/szimek/signature_pad

I can include the libray and initialize it with no problem but the problem arrises when you try to access the Javascript object through a different client side method.

EX:

({
  initSignature: function(component, event, helper) {
    console.log('init');

    var canvas = component.find("signCanvas").getElement();
    var signaturePad = new SignaturePad(canvas);
  },
	saveSignature: function(component, event, helper) {
    console.log('save');
    signaturePad.toDataURL()
	},
})

I need "signaturePad" to be accessible from all my Client-side controller methods.

Is there a way to have a globally accessible var?

Cheers,
Laurent