issue/2876 JSX version of text

[ghost]

part of adaptlearning/adapt_framework#2876

[ghost]

Found a framework bug during the conversion: when instruction text isn't provided, components.jsx line 42 attempts to evaluate mobileInstruction but mobileInstruction isn't defined in components.jsx lines 7-13

  const {
    displayTitle,
    body,
    instruction,
    _component,
    _disableAccessibilityState
  } = data;

because, presumably, it isn't defined on the component model. This results in runtime error 'Uncaught ReferenceError: mobileInstruction is not defined'.

Update: This also occurs when IT is left off the accordion (only other component I currently have using jsx).

[oliverfoster]

Fixed in commit adaptlearning/adapt_framework@87f15ed hopefully.

because, presumably, it isn't defined on the component model. This results in runtime error 'Uncaught ReferenceError: mobileInstruction is not defined'.

It's because this line https://github.com/adaptlearning/adapt_framework/blob/issue/2824-jsx/src/core/templates/partials/component.jsx#L43 is using a variable which is hasn't been defined, only if instruction is a falsie. I forgot to declare that variable from the data on the lines you've referenced https://github.com/adaptlearning/adapt_framework/blob/issue/2824-jsx/src/core/templates/partials/component.jsx#L7-L14

[oliverfoster]

As discussed, things I need to work on:

• core/templates/partial/component.jsx needs to handle the instruction/mobileInstruction switching which is migrating behaviour that is currently managed in some of the components (narrative/hotgraphic) into the framework as a global feature
• img loading=eager needs handling in the react templates as it currently is in the handlebars ones
• I should change the syntax to pass the model, view into the templates rather than view, data

UPDATE: all of the above are implemented in the fw branch issue/2824-jsx

[cahirodoherty-learningpool]

👀

[oliverfoster]

Ready to review, requires pr#3140

[ethan-lp]

👀

[cahirodoherty-learningpool]

👀

[tomgreenfield]

👁️