supportedFormFactors and the Salesforce Mobile App
By the end of this lesson, you'll be able to:
- Recognize the Salesforce Mobile App as a genuine, common usage context
- Configure supportedFormFactors in a component's meta.xml
- Explain why designing for both form factors from the start beats retrofitting later
Prerequisites: Module 17: "Project: LWC Calling a Secure External REST Service"
The Salesforce Mobile App Is a Real Usage Context
Module 9 noted this in passing while covering responsive layout — worth restating directly here: components genuinely run inside the native Salesforce Mobile App, not only inside desktop Lightning Experience. Real users, on real phones, interact with the exact same components built throughout this course.
supportedFormFactors
<!-- accountWorkspace.js-meta.xml -->
<targetConfigs>
<targetConfig targets="lightning__RecordPage">
<supportedFormFactors>
<supportedFormFactor type="Large" />
<supportedFormFactor type="Small" />
</supportedFormFactors>
</targetConfig>
</targetConfigs>supportedFormFactors, set inside a component's *.js-meta.xml (Module 2), declares which form factors a component supports — Large (desktop/tablet) and/or Small (phone). A component not marked for Small simply won't be offered as a placement option for mobile-oriented pages and layouts at all.
Designing With Both in Mind From the Start
Retrofitting mobile support onto a component that was built with only desktop assumptions baked in — fixed pixel widths, hover-only interactions — is genuinely more work than designing responsively from the outset. Lessons 2 and 3 cover exactly the practices that make this retrofit unnecessary in the first place.
Exercise
Write the supportedFormFactors block declaring support for both Large and Small form factors on a lightning__RecordPage target.
Show hint
Follow the structure shown in the lesson.
Exercise
Challenge: explain, as a comment, what happens to a component that omits Small from its supportedFormFactors.
Show hint
Think about where the component becomes available for placement.
supportedFormFactors and the Salesforce Mobile App Quiz
My Notes
Log in to keep private notes on this lesson.
Questions about this lesson
No questions yet — be the first to ask.
Log in to ask a question about this lesson.
Summary
Components genuinely run inside the native Salesforce Mobile App on real phones — supportedFormFactors is the meta.xml setting that controls whether a component is even offered for that context at all.