Jitendra Zaa's Blog

Scan Barcode in LWC Natively

Barcode in LWC

Around 7 years back I have written this post which shows how Barcode scan can be supported in Visualforce and in aura component with the help of an external javascript library quagga.

Salesforce recently released a new Barcode API which now supports barcode scanning natively on LWC for mobile devices. As it’s supported natively, we don’t need to worry about maintaining 3rd party Javascripts, Locker services, performance issues, etc.

At the time of writing this blog post, around 10 different types of barcodes are supported.

Using Microsoft Adaptive Cards in LWC

Adaptive Cards in Salesforce

There could be a situation in your project where UI components in your application need to be defined at run time where Salesforce may or may not have control. We can solve this situation in LWC using CSS or template:if directive.

There is another alternative to the above problem statement, which can be an extremely lightweight framework from Microsoft – Adaptive cards.

In nutshell, Adaptive cards take a JSON input and convert it to HTML UI elements. In this blog post, I would be sharing simple source code to depict how it works.

Choosing Between Relationships, Standard & Custom Objects – Video & Presentation

Few of the most common areas where Salesforce professionals or CTA candidates struggle are

Deciding on when to use Standard vs Custom Object
When to use Lookup vs Master Detail Relationship

Point & Click Based Integration Between Facebook Messenger And Salesforce In 5 Minutes

Salesforce & Facebook Messenger Integration

Yes, you have read it right. We would be integrating Salesforce & Facebook Messenger within 5 minutes without writing any single like of code.

This impossible task of integrating two systems seamlessly is done by Digital Engagement. If Digital Engagement is a new product for you, I would strongly recommend reading my previous post, where I covered it in a little bit more detail.

What do you need to set up Digital Experience?

You would need a business that you want to grow by leaps and bounce, its Facebook Page, Salesforce Service Cloud, and Digital Experience add-on license.

Once you got all these, the first step would be to enable Messaging and for that navigate to Setup | Feature Settings | Service | Messaging Settings and enable Messaging.

Enable SMS In Salesforce Using Digital Engagement

Salesforce Digital Experience - SMS

Amazon, Apple, Google, etc all trillion-dollar companies, what do they have in common? Their obsession for customer service & keeping customers at the center of your business.

It’s not only about trillion-dollar companies, but also medium and small businesses, if they want to succeed in this comparative market, they need to make sure customer service is at the heart of their business.

If I ask you a question, which technology gadget you cannot live with ? That’s your mobile phone and it is pretty much possible that you are reading this blog post right now on your mobile device.

So, if you are a customer and you have some issue, what are some of the options that you would like to use to contact companies? Phone calls are great but the problem is its real-time communication and you need to be on call with a customer representative and cannot do multi-tasking.

The email could be another option, but spammers, marketers they have flooded our email box and to be honest, I hate opening my emails, there are tons of unread email every day.

So, what point I’m trying to make here? I’m indirectly talking about channels and ways customers can try to connect to the company if they face issues. Phone & emails are out because of some reasons mentioned above. The few options which are left are Social media, Live chat, or SMS. Customers can do multi-tasking while using all these channels. They don’t need to be on call for 30 mins or 1 hour to get issues resolved.

That brings us to our blog post title, how can we use SMS in Salesforce to enable customers to reach out via text message? Today, we have lots of options like AppExchange products, Live Message and then there is the new kid on the ground – Digital Engagement.

Live Message product in Salesforce was part of heywire acquisition in 2016. However, like most Salesforce products, Live Message is scheduled to be retired in an effort to give a single omni channel experience to customer reps for all digital channels, which in my opinion is a welcome move.

Enough of background, let’s dive into how do we set up SMS in digital experience.

5 Steps to increase your chances of passing Certified Technical Architect – CTA certification

5 Steps to pass CTA

As you may have observed, I was on hiatus for the last few months and the reason for that was CTA exam preparation.

The purpose of this blog post is to share my experience and motivate you to embark on this journey.

Lets bust some of the myths around CTA

Getting designer certification does not mean you have good platform knowledge. There are many aspects that are not covered in designer exams like Tableau CRM, Heroku, Mulesoft, CPQ, etc
Certification is not easy if you are a developer, admin, or consultant. Everyone has something to learn. If you are a good developer then you will need to work on your communication and articulation. If you are a good admin then you would need to learn customization capability etc
This exam is easy for a few candidates who are CTO or have 15+ years of experience. That’s not true. Definitely some presale role, Architect & leadership experience will help in exam. EVERYONE that I have met has put hundreds of hours after office & over the weekends. Success may look easy from the outside but behind the scene, it’s a huge effort.

In my opinion, You need to have the right balance of Platform knowledge, Story Articulation capability, Overall strategy, and Time Management, which was my CTA Mantra.

Breaking 5 Myths – Scratch Orgs & Salesforce DX

Its been around 3 years that Salesforce has released new tooling set for developers – Salesforce DX. I’ve been working on Salesforce since days of S-Control around 2008 and have seen extreme changes on platform for better.

To be honest, it’s tough to keep yourself up to date on latest changes that Salesforce has been doing , however there are resources like Medium, Trailhead and many other blogs to help you get up to speed.

I’ve seen days and written code on Force.com IDE, Developer Console, many web based IDE and definitely my heart and love at the moment is with VSCode more importantly Scratch Org & unlocked packages.

Purpose of this blog post is to bust some of myths around using Scratch Org in Salesforce DX however before I start, lets agree on below aspects of project development & management

Most of projects in Salesforce follows Agile and one of most important aspect of Agile is Devops. Your team should spend enough time & energy in planning Devops strategy like branch structure, tools, processes etc. In my experience , Devops is more about process rather than tool.
On basis of above point, Source of truth for code & configuration should be your Source Code Management , which in most of cases is Git.

What if your project is not following above 2 principles ? Well, you might already able to relate some of problems like why code is overwritten , no track of which class or fields created by who and why ? Your team spending most of time fixing deployment issue instead of working on actual implementation.

Lets not spend more time and directly jump on some of myths about using scratch org

Myth 1 – Scratch Org is only for packaging & ISV partners

Scratch Org can be used for quick POC or actual implementations. I’ve been using scratch org for each user story which normally takes 1-3 weeks of implementation. Every time, scratch org created, I get liberty to choose which Git branch would be source of truth. Can you refresh dev pro sandbox from Full copy or use 10 days old code that was in production ? There are many other considerations while creating sandbox, you don’t have much control on which metadata would be carried over as starting point.

Fix Error “Cannot assign to read only property” and print Proxy Object of LWC

As its code-snippet post, its going to be very short but frequently used.

Salesforce decorator @track is reactive , which means if value in JavaScript changes, equivalent HTML UI would also change. You don’t need to mark primitive data types as track, as its enabled by default for them. However for complex structure / object we need to mark variable as @track.

Whenever any JavaScript object marked as @track, Salesforce wraps that object resulting in proxy object. If you try to print that on console, you would not be able to see its value.

That being said, there is no change in way you access it, it’s exactly like any other Javascript object we use. So, if you want to see content of proxy object, just call below method and pass your proxy object.

//Get Javascript object equivalent to Proxy
    proxyToObj(obj){
        return JSON.parse(JSON.stringify(obj));
    }

Another way is, just keep another variable without @track decorator to see content. However problem would be – you need to make sure to keep it in sync every time content of original @track object changes.

Fixing error – Cannot assign to read only property

Above error occurs when we try to change public property on LWC marked as @api

@api someVar
.... some code

somemethod(event){
    //error on below line - Cannot assign to read only property
     someVar.isSelected = true;
}

Above code block would throw an error as we are trying. to change property on object declared by @api

@api someVar
.... some code

somemethod(event){
    //clone @api variable using method we just created
    let tmpObj = this.proxyToObj(someVar);
     tmpObj.isSelected = true;
    //now assign this tmp variable back to original
   someVar = tmpObj;
}

To fix above error, use can do something like

Salesforce Integration with Nodejs based applications using Canvas

Salesforce Canvas Integration

Salesforce provides many ways to integrate with external systems like SOAP, Rest, Bulk API, User Interface API and so on. One of useful way to integrate any existing web applications with Salesforce is using Canvas.

For sake of this post, I’m using Nodejs application and complete source code can be found here , on my Github repository. It can be deployed on Heroku easily, however I used my local computer to run canvas. That also proves point that integration is happening via Browser and therefore canvas application can be hosted on premise and not necessarily on DMZ layer.

Step 1 : Create Connected App in Salesforce

Enable OAuth in Connected app and provide any Callback URL. Canvas app does not use callback URL however we DO NEED scope.

Next step would be enabling canvas app itself connected app along with locations where we would be using it.

Change Icon Color in Lightning Web Component

Lightning Web Component provides hundreds of standard icon to choose from this list. And Lightning Web Components like lightning-icon or button-icon can be used to choose these icons.

If we want to change background color of these icons then only colors we have are green, yellow, red or gray as per their variant success, warning , error or inverse.

If you ever try to change color of these icons using fill property, you would be disappointed. Lightning Web Component used shadow DOM to encapsulate components from outer world, same principal here restricts us changing icon background color.

Try yourself [Not Working]