Rendering params object undefined when DetailedRenderingParams true and no parameter fields set

[bewards]

Description

According to this PR, the rendering parameters params object will be present in the JSON response even if rendering doesn't have parameters assigned yet.

I'm noticing on XM Cloud with Next.js that if the Sitecore setting LayoutService.DetailedRenderingParams is set to true and a new component is added to the page (where no rendering parameters are yet to be set), the params object is undefined.

Additional information

No response

[illiakovalenko]

Hey @Rmatkovsky @sc-dawidrutkowski @alan-null Can I ask one of you, please, to share some insights on this configuration? I believe it falls more within your expertise. Would be nice to understand if it's a bug or it's an expected behavior

[sc-dawidrutkowski]

@illiakovalenko The change @bewards is referring to was done ages ago - in 2019. At that time the SXA team was maintaining projects like Layout Service or Sitecore.JavaScript.Services which are now owned by the DevEx team.
Sorry but I won't help you here, I simply don't remember what was that change about.

[illiakovalenko]

@sc-dawidrutkowski Thanks! Understood.
@OlegJytnik looks like we need your input on this topic, if you can take a look, please 😊

[bewards]

For example, any SXA OOTB components render the class params as [Object object]. I don't have control over the FEaaS component since it's from the npm package:

To resolve this for SXA react components I can control, I write a method called getRenderingParam that detects if the value is a string, json string, or object:

const DefaultContainer = (props: ComponentProps): JSX.Element => {
  const containerStyles = props.params && props.params.Styles ? props.params.Styles : '';
  const styles = `${getRenderingParam(props.params.GridParameters)} ${containerStyles}`.trimEnd();

type CustomRenderingParameter = KeyValuePair | RenderingParamGrid | string | null;

export const getRenderingParam = (param: CustomRenderingParameter): string => {
  let renderingParam = '';

  if (!param) return renderingParam;

  if (typeof param === 'string') {
    if (!param.startsWith('{')) {
      return param;
    }
    try {
      const paramObj = JSON.parse(param);
      if (paramObj.Value) {
        renderingParam = paramObj.Value.value;
      } else if (paramObj.Class) {
        renderingParam = paramObj.Class.value;
      }
    } catch (e) {
      logError({ e, pre: 'getRenderingParam error:' });
    } finally {
      // if we already have a string, return it
      return param;
    }
  } else if ('key' in param) {
    renderingParam = param.value.value;
  } else if ('Class' in param) {
    // support for RenderingParamGrid (SXA Grid Params when LayoutService.DetailedRenderingParams = true)
    renderingParam = param.Class.value;
  }

  return renderingParam;
};

[art-alexeyenko]

@bewards ooh, this is interesting, definitely looks to be a bug.
Can I clarify the repro steps with you? Roughly it would be:

1. Set LayoutService.DetailedRenderingParams to true in Sitecore configuration.
2. Setup and render a FEAAS component on page
3. It will have invalid class.

Would that be right?