Build a Shape Manager - Step 33

JavaScript
1

Tell us what’s happening:

I am correctly updating the result text when the shape is circel yet test 1 refuses to pass. I already moved it in the if statement before posting so that did’nt help much. Error says "Your updateResult function should correctly update the result text when the shape is circle.

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: index.ts */
// User Editable Region
interface Shape {
  type: string;
}

interface Circle extends Shape {
  type: "circle";
  radius: number;
}

interface Rectangle extends Shape {
  type: "rectangle";
  width: number;
  height: number;
}

interface Triangle extends Shape {
  type: "triangle";
  base: number;
  height: number;
}

type Shapes = Circle | Triangle | Rectangle;

const getElement = (id: string): HTMLElement => {
  const el = document.getElementById(id);
  if (!el) throw new Error(`Element not found: ${id}`);
  return el;
};

let shapeTypeSelect: HTMLSelectElement;

let propertyGroups: {
  circle: HTMLElement;
  rectangle: HTMLElement;
  triangle: HTMLElement;
};

let propertyInputs: {
  radius: HTMLInputElement;
  width: HTMLInputElement;
  height: HTMLInputElement;
  base: HTMLInputElement;
  triangleHeight: HTMLInputElement;
};

let resultText: HTMLElement;
let resultCard: HTMLElement;

const chooseShape = (shapeType: string) => {
  Object.entries(propertyGroups).forEach(([name, group]) => {
    if (name === shapeType) {
      group.classList.remove("hidden");
    } else {
      group.classList.add("hidden");
    }
  });
};

const toggleResultCard = (show: boolean) => {
  if (show) {
    resultCard.classList.add("visible");
  } else {
    resultCard.classList.remove("visible");
  }
};

const calculateArea = (shape: Shapes): string => {
  switch (shape.type) {
    case "circle":
      return `Area of Circle: ${(Math.PI * shape.radius ** 2).toFixed(2)}`;
    case "rectangle":
      return `Area of Rectangle: ${shape.width * shape.height}`;
    case "triangle":
      return `Area of Triangle: ${0.5 * shape.base * shape.height}`;
    default:
      const _nonExistent: never = shape;
      return _nonExistent;
  }
};

function updateResult() {
  const shape = shapeTypeSelect.value;
  let result: string = "";
   if(shape === "circle"){
   result = calculateArea({type: 'circle', radius: 8}) ;
  };
     resultText.textContent = result;
}

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/148.0.0.0 Safari/537.36

Challenge Information:

Build a Shape Manager - Step 33

GitHub Link: freeCodeCamp/curriculum/challenges/english/blocks/workshop-shape-manager/69145fa5538ad66a9cc848a8.md at main · freeCodeCamp/freeCodeCamp · GitHub

2

hello!

try passing the user provided value for the radius instead of a hard-coded value.