Courseiva

CCNA User Interface Questions

46 of 121 questions · Page 2/2 · User Interface · Answers revealed

Practice these questionsDomain overviewAll questions
76
MCQhard

A developer creates a Lightning Web Component that includes a third-party JavaScript library loaded via a Static Resource. In which lifecycle hook should the third-party library be initialized?

A.disconnectedCallback
B.connectedCallback
C.renderedCallback
D.constructor
AnswerB

Appropriate for initiating asynchronous operations like loading scripts.

Why this answer

Third-party scripts loaded via loadScript should be initialized in connectedCallback or renderedCallback, typically after successful promise resolution.

Practice this question →
77
MCQmedium

A developer is building a Visualforce page that uses a custom controller and needs to display a message to the user when an error occurs. Which class and method should be used?

A.ApexPages.currentPage().getParameters().put()
B.ApexPages.addMessage()
C.Database.addError()
D.System.debug()
AnswerB

Adds a message object to the page messages queue.

Why this answer

ApexPages.addMessage() adds an ApexPages.Message to the page messages list.

Practice this question →
78
MCQeasy

Which annotation must be used on an Apex method to make it available for use with the @wire service in a Lightning Web Component?

A.@RemoteAction
B.@AuraEnabled(cacheable=true)
C.@InvocableMethod
D.@AuraEnabled
AnswerB

Required for wire service access.

Why this answer

Apex methods must be annotated with @AuraEnabled(cacheable=true) to be usable with @wire.

Practice this question →
79
MCQmedium

A developer is implementing a Lightning Web Component with a custom CSS file. How does the component load its associated stylesheet?

A.By declaring the stylesheet in the component's js-meta.xml configuration file.
B.By importing the CSS file explicitly at the top of the JavaScript file using an import statement.
C.Automatically by sharing the exact base file name in the same component bundle folder.
D.Using a <link rel="stylesheet"> tag inside the component HTML template.
AnswerC

Correct because LWC shadow DOM automatically bundles stylesheets sharing the component name.

Why this answer

LWC automatically loads a CSS file with the same name as the component JavaScript and HTML files if placed in the same bundle.

Practice this question →
80
Multi-Selecthard

A developer is troubleshooting a Lightning Web Component where data retrieved via the @wire service needs to be formatted before being rendered in the template. Which THREE approaches are valid ways to handle or transform wired data? Choose 3 answers.

Select 3 answers
A.Directly mutate the object properties returned by the wire adapter inside the template.
B.Use a getter function that evaluates the wired property and returns the formatted result.
C.;Transform data within an Apex method before returning it to the wire service.
D.Use the renderedCallback() hook to modify the raw wired data object directly.
E.Use a wire adapter function (property-and-function syntax) to process data into a local reactive property.
AnswersB, C, E

Correct. Getters can derive formatted values reactively from wired properties.

Why this answer

Wired data can be handled via wired adapter property results using a getter, a wired function that transforms the value into a tracked local property, or custom wire adapters.

Practice this question →
81
Multi-Selectmedium

Which TWO ways can a developer trigger a server-side Apex method imperatively from a Lightning Web Component? Choose 2 answers.

Select 2 answers
A.Import the Apex method as a JavaScript function from '@salesforce/apex/ClassName.methodName'.
B.Decorate the call with @wire in the JavaScript controller.
C.Call the method synchronously on the main thread.
D.Use standard form submission tags in HTML.
E.Invoke the imported function and handle the result using .then() and .catch() promise syntax.
AnswersA, E

Standard import syntax for Apex in LWC.

Why this answer

Imperative Apex calls return a Promise and are imported directly from the Apex class method.

Practice this question →
82
MCQhard

A developer is creating a Lightning Web Component and needs to style a child component from a parent component across the shadow DOM boundary. What feature enables custom styling hooks?

A.Using CSS custom properties (variables) defined by the component.
B.Setting style attributes directly via JavaScript on child elements.
C.Using global CSS stylesheets
D.Using the >>> combinator selector
AnswerA

Styling hooks allow developers to style shadow DOM elements via CSS custom properties.

Why this answer

CSS custom properties (CSS variables) defined with --slds or custom component variables can pierce the shadow DOM if exposed.

Practice this question →
83
MCQeasy

A developer is building a Lightning Web Component and needs to execute code as soon as the component is inserted into the DOM. Which lifecycle hook should the developer use?

A.constructor()
B.disconnectedCallback()
C.renderedCallback()
D.connectedCallback()
AnswerD

Correct because connectedCallback is called when the component is inserted into the DOM.

Why this answer

connectedCallback() is invoked when a component is inserted into the DOM, making it ideal for initialization logic that requires DOM readiness or wire adapters.

Practice this question →
84
MCQhard

A developer is implementing navigation in a Lightning Experience app using the NavigationMixin service in a Lightning Web Component. The developer wants to navigate to a standard ListView for the Account object. What is the correct type to specify?

A.type: 'standard__objectPage', attributes: { objectApiName: 'Account', actionName: 'list' }
B.type: 'standard__webPage', attributes: { url: '/lightning/o/Account/list' }
C.type: 'standard__recordPage', attributes: { objectApiName: 'Account', actionName: 'view' }
D.type: 'standard__namedPage', attributes: { pageName: 'accountList' }
AnswerA

Correct because objectPage with actionName list navigates to a standard object list view.

Why this answer

NavigationMixin.Navigate uses standard page references where type is 'standard__objectPage' and actionName is 'list'.

Practice this question →
85
MCQhard

A developer is troubleshooting a Lightning Web Component where data returned from an Apex wire adapter needs to be mutated before being rendered. What is the correct pattern to handle this?

A.Decorate the wire property with @api mutable to allow direct writes.
B.Use the eval() function to strip immutability constraints from the prototype chain.
C.Create a shallow copy or clone of the wire data object in a getter or property assignment before mutation.
D.Directly assign new properties to the object returned by the wire adapter property.
AnswerC

Correct because cloning the immutable wire object allows modification.

Why this answer

Data returned by wire adapters is immutable (frozen). To mutate it, the developer must create a shallow copy of the data object.

Practice this question →
86
MCQeasy

What is the correct file extension for a Lightning Web Component HTML template file?

A..vfp
B..page
C..html
D..cmp
AnswerC

Standard extension for LWC templates.

Why this answer

LWC HTML template files must use the .html extension and share the component base name.

Practice this question →
87
MCQhard

A developer is configuring a Lightning Web Component that uses the Lightning Message Service (LMS). Which module must be imported to publish a message on a message channel?

A.lightning/uiRecordApi
B.lightning/empApi
C.lightning/navigation
D.lightning/messageService
AnswerD

Provides publish, subscribe, and release functions for LMS.

Why this answer

publish function and the message channel reference are imported from lightning/messageService and the channel definition file respectively.

Practice this question →
88
Multi-Selecthard

Which THREE actions should a developer take to optimize Visualforce view state performance? Choose 3 answers.

Select 3 answers
A.Store sObjects in public static variables.
B.Query only the fields needed in the page rather than entire sObjects.
C.Mark member variables that do not need to be preserved across postbacks as transient.
D.Store large lists of static data in controller member variables.
E.Minimize the number of form components and controller state variables.
AnswersB, C, E

Reduces object size in view state.

Why this answer

To optimize view state, developers should use the transient keyword, minimize controller sObject queries/fields, and use custom wrapper classes where appropriate.

Practice this question →
89
MCQmedium

A developer is writing a Visualforce page with custom controller logic and needs to ensure that database operations are executed transactionally. What happens by default when an unhandled exception occurs during a controller action method?

A.The entire transaction is rolled back.
B.The user is redirected to the login page.
C.Only partial records are saved; successful ones are committed.
D.Changes are committed and an email is sent to the admin.
AnswerA

Salesforce transactions are atomic; unhandled exceptions cause a full rollback.

Why this answer

All database changes in the transaction are rolled back automatically by the platform if an unhandled exception occurs.

Practice this question →
90
MCQmedium

A developer is building a Lightning Web Component that needs to fetch records imperatively based on a user interaction. Which Lightning module should the developer import to access Salesforce data imperatively in JavaScript?

A.lightning/platformResourceLoader
B.@salesforce/schema
C.@salesforce/apex
D.lightning/uiRecordApi
AnswerC

Correct. The @salesforce/apex module allows importing Apex methods for imperative calls.

Why this answer

To call Apex methods imperatively in a Lightning Web Component, developers must import the method from the @salesforce/apex scoped module.

Practice this question →
91
MCQmedium

A developer has a Lightning Web Component with a reactive property 'recordId'. How should the property be decorated to ensure it receives the current record ID when placed on a record page?

A.@wire recordId;
B.@track recordId;
C.@wire(getRecord) recordId;
D.@api recordId;
AnswerD

@api exposes the property so Salesforce can inject the record ID.

Why this answer

@api makes properties public so the container can pass values like recordId into the component.

Practice this question →
92
MCQeasy

A developer wants to include a custom styling hook to override a standard Lightning Design System component token in a Lightning Web Component. Where should this CSS custom property be defined?

A.Inside the component controller JavaScript file (.js)
B.In the component's cascading style sheet file (.css)
C.In a separate Static Resource uploaded to Salesforce
D.In the component's configuration file (.js-meta.xml)
AnswerB

Correct. SLDS styling hooks are defined inside the component's CSS file.

Why this answer

Custom properties to override SLDS tokens should be defined in the component's style sheet (.css file) targeting the component's host or matching elements.

Practice this question →
93
MCQeasy

Which SLDS grid class should be used to create a flexible container where items wrap automatically onto multiple rows?

A.slds-wrap
B.slds-col
C.slds-nowrap
D.slds-grid
AnswerA

Allows grid items to wrap to multiple lines.

Why this answer

slds-wrap enables wrapping in SLDS flexbox grids.

Practice this question →
94
MCQeasy

What is the maximum number of view state bytes allowed in a Visualforce page before Salesforce throws an error?

A.1 MB
B.172 KB
C.64 KB
D.512 KB
AnswerB

Standard Salesforce view state limit.

Why this answer

The maximum view state limit for a Visualforce page is 172 KB.

Practice this question →
95
Multi-Selectmedium

Which TWO techniques can be used to pass data from a parent component to a child Lightning Web Component? Choose 2 answers.

Select 2 answers
A.Using application events via $A.get('e...')
B.Calling public @api methods defined on the child component instance from the parent JavaScript.
C.Directly modifying child private properties using DOM queries.
D.Using global window variables.
E.Binding properties to public @api properties on the child component in the parent template.
AnswersB, E

Allows imperative data passing or action invocation.

Why this answer

Data is passed down via public properties decorated with @api or by invoking public child methods.

Practice this question →
96
MCQhard

A developer creates a Lightning Web Component that consumes data from a wire adapter. The wire adapter returns an object with 'data' and 'error' properties. What is this pattern called in LWC?

A.Event emitter pattern
B.Promise chaining
C.Async/await callback pattern
D.Wired property / result object pattern
AnswerD

Wire results provide data and error properties.

Why this answer

Wire adapters return a wrapper object containing data and error properties.

Practice this question →
97
MCQeasy

A developer is building a Lightning Web Component that must be made available for use on Lightning Record Pages. Which configuration tag must be included in the component's metadata file?

A.lightning__UtilityBar
B.lightning__GlobalAction
C.lightning__RecordPage
D.lightning__AppPage
AnswerC

Correct. lightning__RecordPage makes the component available for placement on record pages in Lightning App Builder.

Why this answer

To expose a component on a record page, the targets list must include lightning__RecordPage.

Practice this question →
98
MCQhard

A developer is writing a Lightning Web Component and needs to conditionally render a block of HTML markup based on a boolean property named 'isVisible'. What is the correct syntax in the HTML template?

A.<apex:outputPanel rendered="{!isVisible}">
B.<template condition="{isVisible}">
C.<template if:true={isVisible}>
D.<div ng-if="isVisible">
AnswerC

Correct because template with if:true is the standard conditional rendering directive.

Why this answer

Conditional rendering in LWC uses the l:if directive or template conditional directives. Wait, the correct directive is lwc:if.

Practice this question →
99
MCQhard

A developer needs to catch unhandled JavaScript errors in a Lightning Web Component hierarchy so the entire app doesn't crash. Which lifecycle hook handles errors thrown by descendant components?

A.errorCallback
B.catchCallback
C.disconnectedCallback
D.faultCallback
AnswerA

Catches errors from child components.

Why this answer

errorCallback() is invoked when a descendant component throws an error in any of its lifecycle hooks or event handlers.

Practice this question →
100
Multi-Selecthard

Which THREE requirements must be met when implementing a custom Lightning Web Component pagination control? Choose 3 answers.

Select 3 answers
A.Slice the master dataset array based on current offset and limit calculations.
B.Use standard Visualforce standardSetController inside the LWC JavaScript.
C.Disable navigation buttons (Next/Previous) when boundary conditions are reached.
D.Maintain reactive properties for the current page number and page size.
E.Directly mutate the server database on every page click.
AnswersA, C, D

Slicing arrays displays the correct subset for the page.

Why this answer

Custom pagination requires managing current page state, calculating total pages, and updating displayed subsets of data reactively.

Practice this question →
101
Multi-Selectmedium

Which TWO actions should a developer take when handling errors returned by an imperative Apex call in a Lightning Web Component? Choose 2 answers.

Select 2 answers
A.Call ApexPages.addMessage() to display the error on screen.
B.Extract the error message from the error object structure (e.g., error.body.message).
C.Rethrow the error as an unhandled Java exception.
D.Catch the error using a .catch() block or try/catch with async/await.
E.Use standard window.alert() for all error messaging.
AnswersB, D

Standard Salesforce error body structure format.

Why this answer

Errors from imperative Apex should be caught in a .catch() block and processed or displayed using a toast notification or error banner.

Practice this question →
102
MCQmedium

A developer is creating a reusable LWC utility and needs to invoke an Apex method imperatively. The method accepts a record ID parameter. What is the correct way to pass this parameter in JavaScript?

A.Pass the parameter as an object with property names matching the Apex method parameters: getAccount({ accountId: recordId })
B.Pass the parameter as a positional string argument: getAccount({recordId})
C.Bind the parameter using the @api decorator inside the JavaScript function body.
D.Assign the parameter to the window.apexParams object prior to invocation.
AnswerA

Correct because imperative Apex requires an object parameter mapping.

Why this answer

Imperative Apex methods accept an object whose properties match the parameter names expected by the Apex method signature.

Practice this question →
103
MCQeasy

Which tag is used in Visualforce to embed JavaScript code directly inside the page?

A.<apex:script>
B.<apex:js>
C.<apex:code>
D.<apex:javascript>
AnswerA

Visualforce tag for including scripts.

Why this answer

<apex:includeScript> or <apex:outputPanel> can include scripts, but <apex:includeScript> links external JS files. For inline script, standard HTML <script> tag is used within Visualforce.

Practice this question →
104
MCQhard

A developer is writing a custom wire adapter or working with custom data in LWC and needs to manually provision data or force a refresh of wire data. Which function should be imported from lightning/uiRecordApi or related wire modules?

A.reloadRecord
B.updateRecordCache
C.getRecordRefresh
D.refreshApex
AnswerD

Refreshes data obtained from an Apex wire adapter.

Why this answer

refreshApex is used to imperatively refresh data provisioned by an Apex wire adapter.

Practice this question →
105
Multi-Selectmedium

A developer is designing a Lightning Web Component that needs to be conditionally displayed in different Salesforce containers. Which TWO targets are valid entries in the component's js-meta.xml configuration file? (Choose TWO)

Select 2 answers
A.lightning__CustomField
B.lightning__HomePage
C.lightning__ApprovalProcess
D.lightning__ApexClass
E.lightning__RecordPage
AnswersB, E

Correct because lightning__HomePage targets home pages.

Why this answer

lightning__RecordPage and lightning__HomePage are valid standard targets.

Practice this question →
106
MCQmedium

A developer is creating a Lightning Web Component and needs to iterate over a list of items in the HTML template. Which directive should be used?

A.repeat:for
B.for:each
C.apex:repeat
D.aura:iteration
AnswerB

Iterates over arrays in LWC templates.

Why this answer

for:each is the standard directive for looping in LWC templates.

Practice this question →
107
Multi-Selecthard

Which THREE strategies are recommended for improving the performance of Lightning Web Components rendering large lists of data? Choose 3 answers.

Select 3 answers
A.Use synchronous imperative Apex calls inside template iterators.
B.Provide a unique, stable 'key' attribute (such as record Id) on each iterated element in for:each loops.
C.Implement pagination or virtual scrolling / lazy loading for large datasets.
D.Avoid heavy computations inside template getter properties called during renders.
E.Render all 10,000 records at once in a single flat DOM tree without pagination.
AnswersB, C, D

Helps the diff algorithm track elements efficiently.

Why this answer

Performance for large lists can be optimized by using pagination or infinite scrolling, ensuring unique stable keys in for:each loops, and avoiding complex nested getters.

Practice this question →
108
MCQhard

A developer is working with a Lightning Web Component and needs to ensure reactive updates occur when an object property or array element changes inside a tracked property. What is the correct approach in modern LWC?

A.Reassign the property reference (e.g., this.myObj = {...this.myObj}).
B.Use @track on every inner property.
C.Call component.forceUpdate().
D.Mutate the nested property directly; LWC automatically deep-tracks all mutations.
AnswerA

Assignment triggers reactivity by changing reference.

Why this answer

Assigning a new object or array reference (mutation via replacement) triggers reactivity in LWC tracked properties.

Practice this question →
109
MCQhard

A developer is implementing a Lightning Web Component that handles drag-and-drop functionality. Which native DOM event is typically intercepted to allow a drop action on an element?

A.dragstart
B.dropstart
C.dragover and preventDefault()
D.mousedown
AnswerC

Preventing default on dragover permits dropping.

Why this answer

Preventing default on dragover is required to allow a drop event to fire on an element.

Practice this question →
110
MCQhard

A developer is implementing a Visualforce page that displays a list of accounts and needs to ensure that it adheres to Salesforce security best practices by preventing cross-site scripting (XSS) attacks. Which tag or attribute combination should be used to securely output user-supplied data?

A.<apex:includeScript value="{!userSuppliedScript}" />
B.<apex:outputField value="{!account.Name}"> with escape="false"
C.<apex:outputText value="{!userSuppliedInput}" escape="true" />
D.{!$User.UIThemeDisplayed} without any wrappers
AnswerC

Correct. Setting escape="true" on apex:outputText ensures that user input is properly encoded to prevent XSS.

Why this answer

The apex:outputText tag automatically escapes HTML by default, preventing XSS. Alternatively, setting escape=true on bindings ensures safety.

Practice this question →
111
MCQhard

A developer is writing an Aura component and needs to dynamically create a component at runtime. Which JavaScript method should be used?

A.document.createElement()
B.$A.createComponent()
C.Aura.create()
D.component.new()
AnswerB

Dynamically creates an Aura component.

Why this answer

$A.createComponent() is used to instantiate components dynamically in Aura client-side controllers.

Practice this question →
112
MCQhard

A developer needs to access a specific HTML element in a Lightning Web Component template imperatively. Which method should be called?

A.window.findElement()
B.this.template.querySelector()
C.this.findElement()
D.document.querySelector()
AnswerB

Queries elements within the component template.

Why this answer

this.template.querySelector() is used to query elements inside the component's shadow DOM template.

Practice this question →
113
MCQmedium

A developer is writing a Visualforce page that uses a custom controller. The page needs to execute an action method as soon as the page loads, without requiring user interaction. Which attribute on <apex:page> should be used?

A.initMethod="{!init}"
B.action="{!init}"
C.onLoad="{!init}"
D.loadAction="{!init}"
AnswerB

Correct because the action attribute invokes a controller method on page load.

Why this answer

The action attribute on <apex:page> executes a controller method when the page is requested.

Practice this question →
114
MCQmedium

A developer is working with a Lightning Web Component that uses the @wire decorator to provision data from an Apex method. The Apex method depends on a property that changes dynamically. How should the property be prefixed to signal reactivity to the wire service?

A.Enclose the property name in curly braces ({})
B.Prefix the property name with a dollar sign ($)
C.Prefix the property name with an ampersand (&)
D.Prefix the property name with an underscore (_)
AnswerB

Correct. Prefixing a property with $ informs the wire service to re-run when the property value changes.

Why this answer

Properties passed to a @wire adapter that are reactive must be prefixed with a dollar sign ($).

Practice this question →
115
MCQhard

A developer is implementing a custom pagination mechanism in a Lightning Web Component. The component uses an Apex controller method that returns a list of records. Which technique prevents excessive heap size and improves performance when dealing with large datasets?

A.Fetch all records in a single transaction and slice the array in JavaScript.
B.Store the entire dataset in browser local storage for client-side manipulation.
C.Use the @wire decorator with an unbounded query and enable auto-caching.
D.Use server-side pagination passing page offset and limit parameters to the Apex controller.
AnswerD

Correct because server-side pagination limits governor limits and data transfer.

Why this answer

Implementing server-side pagination with OFFSET and LIMIT or using standard database query locators in Apex is best practice.

Practice this question →
116
Multi-Selecthard

Which THREE practices are considered security best practices when developing custom Visualforce pages to prevent Cross-Site Scripting (XSS)? Choose 3 answers.

Select 3 answers
A.Use standard Visualforce components like <apex:outputText> which automatically HTML-escape output by default.
B.Disable sharing on all controller classes.
C.Set escape="false" on all output components to ensure proper rendering.
D.Use String.escapeJavaScript() when rendering user input inside JavaScript contexts.
E.Encode untrusted user input using JSENCODE or HTMLENCODE helper functions.
AnswersA, D, E

Standard components escape output safely.

Why this answer

Preventing XSS in Visualforce involves escaping output, using standard components which escape by default, and encoding untrusted data.

Practice this question →
117
MCQeasy

A developer needs to ensure that a Lightning Web Component can be placed on a Record Page for an Account in the Lightning App Builder. What must be configured in the component's metadata configuration file?

A.<target>lightning__HomePage</target>
B.<target>lightning__RecordPage</target>
C.<target>lightning__Tab</target>
D.<target>lightningCommunity__Default</target>
AnswerB

Correct because lightning__RecordPage enables the component for record pages.

Why this answer

The target configuration must include lightning__RecordPage and specify the appropriate object support.

Practice this question →
118
MCQhard

A developer has an Aura component that needs to communicate with an unrelated Lightning Web Component located on the same Lightning page. Which feature should the developer implement?

A.Lightning Message Service (LMS)
B.Aura Component Events (app events)
C.A shared JavaScript closure via window globals
D.Direct DOM traversal using document.querySelector()
AnswerA

Correct because LMS enables communication between disparate components across the DOM.

Why this answer

The Lightning Message Service (LMS) allows communication between Visualforce pages, Aura components, and Lightning Web Components across the DOM.

Practice this question →
119
MCQmedium

A developer is building a Lightning Web Component that includes user input fields. To adhere to best practices for accessibility and SLDS form styling, how should form inputs be structured?

A.Use standard HTML inputs without associated label elements.
B.Use <table> tags for layout alignment of form fields.
C.Use SLDS form element containers with corresponding <lightning-input> or HTML input elements paired with explicit labels.
D.Apply inline CSS display:flex directly to raw text areas.
AnswerC

Correct because proper form structure ensures accessibility and SLDS compliance.

Why this answer

Form elements should be wrapped in slds-form-element with proper label and input associations.

Practice this question →
120
MCQeasy

A developer is building a Lightning Web Component and needs to execute code as soon as the component is inserted into the DOM. Which lifecycle hook should be used?

A.renderedCallback
B.constructor
C.connectedCallback
D.disconnectedCallback
AnswerC

This hook is executed when the component is inserted into the DOM.

Why this answer

connectedCallback() is invoked when a component is inserted into the DOM.

Practice this question →
121
Multi-Selectmedium

A developer is creating an Aura component that interacts with Salesforce data. Which TWO tags or features are valid in the Aura framework? (Choose TWO)

Select 2 answers
A.<aura:iteration items="{!v.items}" var="item">
B.<template for:each={items} for:item="item">
C.<aura:attribute name="myAttr" type="String" />
D.<lwc:databind property="{!v.val}" />
E.import { LightningElement } from 'lwc';
AnswersA, C

Correct because aura:iteration iterates over collections in Aura.

Why this answer

aura:attribute and aura:iteration are valid tags in Aura markup.

Practice this question →
← PreviousPage 2 of 2 · 121 questions total

Ready to test yourself?

Try a timed practice session using only User Interface questions.

Start 20-question session