Reading recommendation results¶
Guide type: Reference
Difficulty: Advanced
Applies to: SmartSize JavaScript API
Complete reference for the window.SmartRecom.getResult() return value, including the full result object schema, topCandidates array structure, matchType enum values, and confidence scores.
getResult() return type¶
| Return value | Type | Description |
|---|---|---|
result |
object \| null |
The recommendation result, or null if no recommendation has been computed. |
Always check for null before accessing result properties.
Result object schema¶
interface SmartRecomResult {
sizeFound: boolean;
recommendedSize: string | null;
matchType: 'exact' | 'closest' | 'between-sizes' | null;
topCandidates: TopCandidate[];
measurements?: MeasurementPrediction[];
}
sizeFound¶
| Type | Description |
|---|---|
boolean |
true if a size recommendation was successfully computed. false if the quiz could not determine a size (for example, measurements fall outside all size ranges). |
recommendedSize¶
| Type | Description |
|---|---|
string \| null |
The name of the recommended size (for example, "M", "42", "US 10"). null if sizeFound is false. |
matchType¶
| Value | Description |
|---|---|
"exact" |
The shopper's measurements fall squarely within the recommended size's ranges. |
"closest" |
The shopper's measurements are closest to this size, but may be slightly outside one or more ranges. |
"between-sizes" |
The shopper's measurements fall between two sizes. SmartSize recommends the larger of the two. |
null |
No recommendation was computed. |
topCandidates¶
An array of the best-matching sizes, ordered by likelihood. The first element is the recommended size.
| Property | Type | Description |
|---|---|---|
sizeName |
string |
The size name (for example, "S", "M", "L"). |
likelihood |
number |
A confidence score from 0.0 to 1.0. Higher means a better match. |
Example result objects¶
Exact match¶
{
sizeFound: true,
recommendedSize: 'M',
matchType: 'exact',
topCandidates: [
{ sizeName: 'M', likelihood: 0.95 },
{ sizeName: 'S', likelihood: 0.72 },
{ sizeName: 'L', likelihood: 0.31 }
]
}
Closest match¶
{
sizeFound: true,
recommendedSize: 'L',
matchType: 'closest',
topCandidates: [
{ sizeName: 'L', likelihood: 0.88 },
{ sizeName: 'XL', likelihood: 0.65 },
{ sizeName: 'M', likelihood: 0.42 }
]
}
Between sizes¶
{
sizeFound: true,
recommendedSize: 'M',
matchType: 'between-sizes',
topCandidates: [
{ sizeName: 'M', likelihood: 0.81 },
{ sizeName: 'S', likelihood: 0.79 },
{ sizeName: 'L', likelihood: 0.45 }
]
}
No recommendation¶
Display alternative sizes¶
Use topCandidates to show the shopper how close other sizes are:
function displaySizeRecommendation() {
const result = window.SmartRecom.getResult();
if (!result || !result.sizeFound) {
console.log('No recommendation available yet');
return;
}
// Primary recommendation
document.getElementById('recommended-size').textContent = result.recommendedSize;
// Alternative sizes (exclude the recommended one)
if (result.topCandidates && result.topCandidates.length > 1) {
const alternatives = result.topCandidates
.filter(c => c.sizeName !== result.recommendedSize)
.map(c => `${c.sizeName} (${Math.round(c.likelihood * 100)}% confidence)`)
.join(', ');
console.log(`Alternative sizes: ${alternatives}`);
document.getElementById('alternative-sizes').textContent = alternatives;
}
}
Complete Shopify integration example¶
Add a dynamic size recommendation display to your product page:
// Shopify example: Add dynamic size chart link to product page
function addSizeChartToProduct() {
const productForm = document.querySelector('form[action*="/cart/add"]');
if (!productForm) return;
// Create size chart button
const sizeChartLink = document.createElement('button');
sizeChartLink.type = 'button';
sizeChartLink.className = 'btn btn-secondary size-chart-btn';
sizeChartLink.onclick = () => window.SmartRecom.openSizeChart();
// Add to product form
productForm.appendChild(sizeChartLink);
// Update button text based on recommendation status
function updateSizeChartText() {
if (!window.SmartRecom?.isReady()) {
sizeChartLink.innerHTML = '📏 Size Chart (Loading...)';
sizeChartLink.disabled = true;
return;
}
sizeChartLink.disabled = false;
const result = window.SmartRecom.getResult();
if (result && result.sizeFound) {
sizeChartLink.innerHTML = `📏 Size Chart (Your size: ${result.recommendedSize})`;
} else {
sizeChartLink.innerHTML = '📏 View Size Chart';
}
}
// Initial update
updateSizeChartText();
// Listen for updates
window.addEventListener('smartrecom:result-update', updateSizeChartText);
// Check periodically until SmartRecom is ready
const checkReady = setInterval(() => {
if (window.SmartRecom?.isReady()) {
clearInterval(checkReady);
updateSizeChartText();
}
}, 100);
}
// Initialize when page loads
document.addEventListener('DOMContentLoaded', addSizeChartToProduct);
Debug recommendation issues¶
If a recommendation is not returning the expected size, inspect the full result object:
function debugRecommendation() {
const result = window.SmartRecom.getResult();
console.log('Result:', result);
console.log('Size found:', result?.sizeFound);
console.log('Recommended size:', result?.recommendedSize);
console.log('Match type:', result?.matchType);
console.log('Top candidates:', result?.topCandidates);
if (result?.topCandidates) {
result.topCandidates.forEach(c => {
console.log(` ${c.sizeName}: ${Math.round(c.likelihood * 100)}%`);
});
}
}
Related articles¶
- JavaScript API overview — Complete API surface reference
- Triggering the modal programmatically — How to open the modal from code
- Listening to quiz events — Event system and real-time UI updates