What are different types of flows in Salesforce?

 What are different types of flows in Salesforce?

Salesforce JOB BOARD COURSES BEN

Written by... Tim CombridgeManaging Director of Sensible Giraffe, Tim Combridge is passionate about educating others through high-quality blog content and training courses such as the Ultimate Salesforce Flow Foundation Course.

On January 3, 2022, in Guides

The Ultimate Salesforce Flow Guide for 2022

Please share this article...

Salesforce Flow enables you to create complex business solutions through the use of clicks rather than code. Flow Builder is the most powerful tool available to a Salesforce Admin, giving you similar capabilities to Salesforce developers. Flow is commonly used when you need to perform mass updates across multiple unrelated records or complex logic into opportunity conversion.

Flow's applications are limitless, and its capabilities are expanding all the time.

Angular tutorial part 5 : Learn Angular Routing and testing

 

Routing and
testing

Routing in Angular

•      Component Router

•      Navigating Routes

•      Route Parameters

•      Query Parameters

•      Child Routes

Implement routes first in app routing module

•       Basically this helps creating menus to help user navigate to various components and pass parameters to components.

•       There are various ways routes can be implemented.

•       One of the best ways => In application Routing module import the route dependencies import { Routes, RouterModule ,ActivatedRoute } from '@angular/router';

•        Routes take 2 params,the path name and the target component,all the app routes can be defined here

•       const routes: Routes = [{path: 'Main', component:AppComponent}, {path: 'Form', component: FormappComponent},];

•      Pass this routes to the NGModule imports

•      @NgModule({

•        imports: [RouterModule.forRoot(routes)],

•        exports: [RouterModule]

•      })

•     To create a default routing module when component is created ,use the cli command

•     ng g m [ModuleName] --routing

 

 

Create a new Menu component

•       Generate a new component within the app called menu

•       Add the menu links

•       Welcome To Menu

•         <nav> <a class="button" routerLink="Main">Main</a> | 

•           <a class="button" [routerLink]="['Form',{value1: 'bar'}]">USerForm1</a> </nav>  

•         <router-outlet></router-outlet>

•       Router link param takes two params to genereate hyperlink 1. routename defined in route,then param if needed to be sent to second component.

•       Redirect the application now to point to this menu component as entry point,to do that

•       Change the bootstrap in the appmodule to menucomponent

 

•      bootstrap: [MenuComponent ] 

•     Now when the application starts you will see the 2 menu links ->main and form,each pointing to the component we have created earlier and defined in the routes

•    

 

Passing and Reading params

•       Routerlink can take route and params as inputs,the following router link redirects to form component and sends a param value1 .

•           <a class="button" [routerLink]="['Form',{value1: 'bar'}]">USerForm1</a> </nav>  

•       To Read the param in the target component,we will use activatedroute module

•       import { Router,ActivatedRoute } from '@angular/router'; and inject

•       In component constructor only   constructor(private _Activatedroute:ActivatedRoute,) { }

 

•       And in the  components of form,we will read the params,using activatedroute,parammap and an observable.

•       this._Activatedroute.paramMap.subscribe(params => { 

•           console.log(params);

•           console.log(params.get('value1'));//params passed to this component by routing

•      

 

 

 

 

Component Router

•       • Use the router-outlet directive to tell Angular where you

•       want a route to put its template <router-outlet></

•       router-outlet>

 

Adding the routeconfig to component or module

•       @RouteConfig([

•        {path: '/home', name: 'Home', component: HomeComponent, useAsDefault: true},

•        {path: '/about', name: 'About', component: AboutComponent},

•        {path: '/experiments', name: 'Experiments', component: ExperimentsComponent}

•       ])

•       export class AppComponent {}

 

•       <div id="container">

•        <router-outlet></router-outlet>

•       </div>

 

Navigating Routes

•       Add a routerLink attribute directive to an anchor tag

• Bind it to a template expression that returns an array of route link parameters Users

 • Navigate imperatively by importing Router, injecting it, and then calling .navigate() from within a component method

• We pass the same array of parameters as we would to the routerLink directive this._router.navigate( ['Users'] );

•     <div id="menu">

•      <a [routerLink]="['/Home']" class="btn">Home</a>

•      <a [routerLink]="['/About']" class="btn">About</a>

•      <a [routerLink]="['/Experiments']" class="btn">Experiments</a>

•     </div>

Routerlink

•       Add a routerLink attribute directive to an anchor tag

• Bind it to a template expression that returns an array of route link parameters Users

 • Navigate imperatively by importing Router, injecting it, and then calling .navigate() from within a component method

• We pass the same array of parameters as we would to the routerLink directive this._router.navigate( ['Users'] );

•         Programmatically allows you to navigate to path

export class App {

constructor(private _router: Router) {}

navigate(route) { this._router.navigate([`/${route}`]); }

 }

Query Parameters

• Denotes an optional value for a particular route

• Do not add query parameters to the route definition

•     { path:'/users', name: UserDetail, component:

•     UserDetail }

• Add as a parameter to the routerLink template

•     expression just like router params: <a

•     [routerLink]="['Users', {id: 7}]"> {{user.name}} </a>

• Also accessed by injecting RouteParams into a component

Query Params

•        <div>

•         <button [routerLink]="['./MyComponent', {id: 1}]">

•         My Component Link</button>

•         <button [routerLink]="['./AnotherComponent', {queryParam: 'bar'}]">

•         Another Component Link</button>

•        </div>

•        Com

Query Params

•     import { Component } from 'angular2/core';

•     import { RouteParams } from 'angular2/router';

•     @Component({

•      selector: 'my-component',

•      template: `<h1>my component ({{routeParams.get('id')}})!</h1>`

•     })

•     export class MyComponent {

•      constructor(routeParams: RouteParams) {

•      this.routeParams = routeParams;

•      }

•     }

Child Routes

• Ideal for creating reusable components

• Components with child routes are “ignorant” of the parents’ route implementation

• In the parent route config, end the path with /…

• In the child config, set the path relative to the parent path

• If more than one child route, make sure to set the default route

Child Routes

•       @RouteConfig([ {

•        path:'/another-component/...',

•        name: 'AnotherComponent',

•        component: AnotherComponent }

•       ])

•       export class App {}@RouteConfig([

•        {

•        path:'/first', name: 'FirstChild',

•        component: FirstSubComponent }])

•       export class AnotherComponent {}

Testing

•     Testing is good practise and mandatory in any project.

•     Testing helps remove bugs and also check the functionality of your application.

•     Angular wraps Jasmine methods

•      Import all necessary Jasmine methods from angular11/

•     testing

•      Import the classes to test

•      Include providers by importing beforeEachProviders

•     and then calling it with a method that return

 

 

•     TestBed is the primary api for writing unit tests for Angular applications and libraries.

•     Methods

•     compileComponents()

•     inject()

•     get()

•     execute()

•     overrideModule()

•     overrideComponent()

•     overrideDirective()

•     overridePipe()

•     overrideProvider()

•     overrideTemplateUsingTestingModule()

•     createComponent()

 

Testing a component

•        Create a component with title =I love  pizza

•        import { Component, OnInit } from '@angular/core';

•        @Component({

•          selector: 'app-pizza',  templateUrl: './pizza.component.html', styleUrls: ['./pizza.component.css']

•        })export class PizzaComponent implements OnInit {

•          title = "I love pizza!"  constructor() { }  ngOnInit() {  }}

 

•        We will create a test to see that component is create with title “I love pizza”

Testing a component (contd..)

•       Writing tests in Angular is easy, now we are going to write a simple test within the describe() function.

•       it(`should have a title 'I love pizza!'`, async(() => { //test has to be written within it

•         fixture = TestBed.createComponent(PizzaComponent);  //create an instance of the component using testbesd class

•         component = fixture.debugElement.componentInstance; //once the component is rendered

•         expect(component.title).toEqual('I love pizza!');//check for whether the component title is equal to “I love pizza”

•       //expect asserts or compares values to expected values

•       }));

•       Run ng test

•       To specifically test one test spect only  ->ng test --main ./src/app/app.component.spec.ts

Testing services

•       To test a service, you set the providers metadata property with an array of the services that you'll test or mock.

•       let service: MyserviceService;

•       beforeEach(() => {  TestBed.configureTestingModule({ providers: [MyserviceService

•       ] });});

•       Then inject it inside a test by calling TestBed.inject() with the service class as the argument.

•       it('should use ValueService', () => { service = TestBed.inject(MyserviceService

•       ); expect(service.showTodayDate()).toBe('real value'); });

 

Angular tutorial part 4 - Learn Angular The HTTP Module •Methods • Observable.toPromise • Error Handling • Header Pipes

 

Server communication

• The HTTP Module

•Methods

• Observable.toPromise

• Error Handling

• Header

Pipes

 

Http Module

•     Http module basically is used to connect to resource on the network

•     and process the result.

•     Returns an observable

Http module

•     request: performs any type of http request

•     get: performs a request with GET http method

•     post: performs a request with POST http method

•     put: performs a request with PUT http method

•     delete: performs a request with DELETE http method

•     patch: performs a request with PATCH http method

•     head: performs a request with HEAD http method

To use http in component

•       Import httpmodule in app module

•       import { HttpClientModule } from '@angular/common/http';

•       Add to imports , imports: [       HttpClientModule   ], in app module

•       Import the following in component ts

•       import { HttpClient, HttpHeaders,HttpHeaderResponse } from "@angular/common/http";

•       Inject httpclient in constructor: constructor(private http: HttpClient) { }

 

 

 

 

Making http post call

•     Real time code creates user record in mysql via springboot endpoint,angular basically calls this springboot endpoint and passes and user class object.

•      

•     private url = 'http://127.0.0.1:8080/insertuser'; 

•     CreateUser(user: User): Observable<any>{

•       var httpOptions = {

•         headers: new HttpHeaders({ 'Content-Type': 'application/json'})

•       };

•       console.log('value from service'+JSON.stringify(user));

•       return this.http.post<User>(this.url,user,httpOptions);

•    

 

Walk through sample code

•     loadItems() {

•     return this.http.get(BASE_URL) //basically a get call is made using the http module

•     .map(res => res.json())/returns a json respononse

•     .toPromise();

•     }

•     createItem(item: Item) {

•     return this.http.post(`${BASE_URL}`, JSON.stringify(item), HEADER)

•     //basically a post call is made on the http module

•     .map(res => res.json()) //process the json response

•     .toPromise();

•     }

Http Put and Delete

•     updateItem(item: Item) {

•     return this.http.put(`${BASE_URL}${item.id}`,

•     JSON.stringify(item), HEADER)

•     .map(res => res.json())

•     .toPromise();

•     }

•     deleteItem(item: Item) {

•     return this.http.delete(`${BASE_URL}${item.id}`)

•     .map(res => res.json())

•     .toPromise();

•     }

Using Observable

•      Observables are really just functions that throw values

•     . Objects called observers define callback functions for next(), error(), and complete().• Composed of subjects and observers

• A subject performs some logic and notifies the

•     observer at the appropriate times

•     Observable.subscribe is used to check result of the method

•     We finalize an observable stream by subscribing to it

•     The subscribe method accepts three event handlers

•     onNext is called when new data arrives

•     onError is called when an error is thrown

•     onComplete is called when the stream is completed

•     source.subscribe(

•     x => console.log('Next: ' + x),

•     err => console.log('Error: ' + err),

•     () => console.log('Completed'));

•     Observable.

Error handling

•     We should always handle errors

•     Chain the .catch method on an observable

•     Pass in a callback with a single error argument

•     this.http.get('users.json')

•     .catch(error => {

•     console.error(error);

•     return Observable.throw(error.json().error || 'Server error');

•     });

Using Promise

•     Promise is another way we can hit a network url and assess the results. Promise is asynch ,that it waits for the response.

•     We can chain any HTTP with toPromise

•     Then we can use .then and .catch to resolve the promise

•     Headers can be added,post of get can be done.

•     this.http.get('users.json')

•     .toPromise()

•     .then(res => res.json().data) //handle the data

•     .then(users => this.users = users)

•     .catch(this.handleError);/if error

Adding Headers

•     Import Headers and RequestOptions:

•     import {Headers, RequestOptions} from 'angular2/http';

•     Headers are an instance of the Headers class

•     Pass in an object with each header as a key-value pair

•     Used mainly to pass security token params

•     Then pass this Headers instance into a new RequestOptions

•     instance

•     let headers = new Headers({ 'Content-Type': 'application/json' });

•     let options = new RequestOptions({ headers: headers });

•     this.http.post('users.json', '{}', options);

Pipes

•     •What are Pipes?

•     • Built-in Pipes

•     • Custom Pipes

•     • Async Pipes

What are pipes

•     A pipe takes in data as input and transforms it to a desired

•     output

•     We use them in our templates with interpolation:

•     <p>User created on {{ created_at | date }}</p>

•     Include parameters to a pipe by separating them with a colon:

•     <p>User created on {{ created_at | date:"MM/dd/yy" }}</p>

•     Pipes are chain-able:

•     <p>User created on {{ created_at | date | uppercase }}</p>

Build in Pipes

•     DatePipe

•     <p>User created on {{ user.created_at | date }}</p>

•     UpperCasePipe

•     <p>Middle Initial: {{ user.middle | uppercase }}</p>

•     LowerCasePipe

•     <p>Username: {{ user.username | lowercase }}</p>

•     CurrencyPipe

•     <p>Price Plan: {{ user.plan.price | currency }}</p>

•     PercentPipe

•     <p>Data Usage: {{ user.usage | percent }}</p>

Build your own custom pipes

•     import { Pipe, PipeTransform } from 'angular2/core';

•     Create a class that implements the PipeTransform interface

•     and includes a transform method:

•     export class ReversePipe implements PipeTransform {

•     transform(value:string, args:string[]) : any {

•     return value.reverse();

•     }

•     }

Pipes for Http calls

•     Resolves async data (observables/promises) directly in the template

•     Skips the process of having to manually subscribe to async methods

•     in the component and then setting those values for the template to

•     bind to

•     Component attribute:

•     asyncAttribute<string> = new Promise((resolve, reject) => {

•     setTimeout(() => resolve('Promise resolved'), 500);

•     })

•     Template: <p>Async result: {{asyncAttribute | async}}</p>