chore: re-introduce uitext wrap (#972)

* Make ui text wrap by default if the property is missing.

* Fixed failing test

* Added test to check the default value if textWrap property is missing

packages/@dcl/react-ecs/src/components/Label/utils.ts

@@ -70,7 +70,7 @@ const parseTextWrap: Readonly<Record<UiTextWrapType, TextWrap>> = {
 /**
  * @internal
  */
-export function getTextWrap(textWrap: UiTextWrapType | undefined): Record<'textWrap', TextWrap> | undefined {
-  if (!textWrap) return undefined
+export function getTextWrap(textWrap: UiTextWrapType | undefined): Record<'textWrap', TextWrap> {
+  if (!textWrap) return { textWrap: TextWrap.TW_WRAP }
   return { textWrap: parseTextWrap[textWrap] }
 }

test/react-ecs/label.spec.tsx

@@ -15,6 +15,26 @@ import { setupEngine } from './utils'
 import { getFontSize } from '../../packages/@dcl/react-ecs/src/components/Label/utils'
 
 describe('UiText React Ecs', () => {
+  it('should generate a UI Label with textWrap set to TW_WRAP as default if missing said property', async () => {
+    const { engine, uiRenderer } = setupEngine()
+    const UiText = components.UiText(engine)
+    const entityIndex = engine.addEntity() as number
+
+    // Helpers
+    const rootDivEntity = (entityIndex + 1) as Entity
+    const getText = (entity: Entity) => UiText.get(entity)
+
+    const ui = () => <Label uiTransform={{ width: 100 }} value="DCLROCKS" />
+
+    uiRenderer.setUiRenderer(ui)
+    await engine.update(1)
+
+    expect(getText(rootDivEntity)).toMatchObject({
+      value: 'DCLROCKS',
+      textWrap: TextWrap.TW_WRAP
+    })
+  })
+
   it('should generate a UI and update the width of a div', async () => {
     const { engine, uiRenderer } = setupEngine()
     const UiTransform = components.UiTransform(engine)
@@ -29,7 +49,7 @@ describe('UiText React Ecs', () => {
     let color: Color4 | undefined = undefined
     let font: UiFontType | undefined = 'sans-serif'
     let textAlign: TextAlignType | undefined = 'bottom-center'
-    let textWrap: UiTextWrapType | undefined = 'nowrap'
+    let textWrap: UiTextWrapType = 'nowrap'
     const ui = () => (
       <Label
         uiTransform={{ width: 100 }}
@@ -63,14 +83,14 @@ describe('UiText React Ecs', () => {
     color = { r: 1, g: 1, b: 1, a: 1 }
     font = undefined
     textAlign = undefined
-    textWrap = undefined
+    textWrap = 'nowrap'
     await engine.update(1)
     expect(getText(rootDivEntity)).toMatchObject({
       value: 'BOEDO',
       color: { r: 1, g: 1, b: 1, a: 1 },
       font: 0,
       textAlign: undefined,
-      textWrap: undefined
+      textWrap: TextWrap.TW_NO_WRAP
     })
     await engine.update(1)
   })