empApi with Lightning Web Components?
How about option 3: Wait a week.
According to the release notes, EmpApi is currently slated to go live in LWC for Summer 19.
Summer 19 is 1 week away, but that won't stop you from preparing it beforehand in your Summer 19 Sandbox or Scratch org.
lightning:empApi does not show LWC button as enabled as its referring to the Spring version of docs.
Also , the release notes dont tell us about how to use empAPI in LWC. I could not find any public documentation on about how to use it.
A quick way to refer docs of lwc is Summer 19 org is to visit the url
https://yourSummer19org.salesforce.com/docs/component-library/bundle/lightning-emp-api/documentation
Sample Example :
<template>
<lightning-card title="EmpApi Example" icon-name="custom:custom14">
<div class="slds-m-around_medium">
<p>Use the buttons below to subscribe and unsubscribe to a streaming channel!</p>
<lightning-input label="Channel Name" value={channelName}
onchange={handleChannelName}></lightning-input>
<lightning-button variant="success" label="Subscribe" title="Subscribe"
onclick={handleSubscribe} disabled={isSubscribeDisabled}
class="slds-m-left_x-small"></lightning-button>
<lightning-button variant="destructive" label="Unsubscribe" title="Unsubscribe"
onclick={handleUnsubscribe} disabled={isUnsubscribeDisabled}
class="slds-m-left_x-small"></lightning-button>
</div>
</lightning-card>
</template>
JS:
import { LightningElement, track } from 'lwc';
import { subscribe, unsubscribe, onError, setDebugFlag, isEmpEnabled } from 'lightning/empApi';
export default class EmpApiLWC extends LightningElement {
@track channelName = '/event/Test__e';
@track isSubscribeDisabled = false;
@track isUnsubscribeDisabled = !this.isSubscribeDisabled;
subscription = {};
// Tracks changes to channelName text field
handleChannelName(event) {
this.channelName = event.target.value;
}
// Handles subscribe button click
handleSubscribe() {
// Callback invoked whenever a new event message is received
const messageCallback = function(response) {
console.log('New message received : ', JSON.stringify(response));
// Response contains the payload of the new message received
};
// Invoke subscribe method of empApi. Pass reference to messageCallback
subscribe(this.channelName, -1, messageCallback).then(response => {
// Response contains the subscription information on successful subscribe call
console.log('Successfully subscribed to : ', JSON.stringify(response.channel));
this.subscription = response;
this.toggleSubscribeButton(true);
});
}
// Handles unsubscribe button click
handleUnsubscribe() {
this.toggleSubscribeButton(false);
// Invoke unsubscribe method of empApi
unsubscribe(this.subscription, response => {
console.log('unsubscribe() response: ', JSON.stringify(response));
// Response is true for successful unsubscribe
});
}
toggleSubscribeButton(enableSubscribe) {
this.isSubscribeDisabled = enableSubscribe;
this.isUnsubscribeDisabled = !enableSubscribe;
}
registerErrorListener() {
// Invoke onError empApi method
onError(error => {
console.log('Received error from server: ', JSON.stringify(error));
// Error contains the server-side error
});
}
}