fix: Progress_table_cell_type floating point rounding issues #2380 (#…

…2415)
h2oai · Oct 14, 2024 · fe7f7bd · fe7f7bd
1 parent 7bd8845
commit fe7f7bd
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 5 deletions.
diff --git a/ui/src/progress_table_cell_type.test.tsx b/ui/src/progress_table_cell_type.test.tsx
@@ -26,7 +26,15 @@ const
     {input: 0.8888, output: '88.88%'},
     {input: 0.88888, output: '88.89%'},
     {input: 0.88899, output: '88.90%'},
-    {input: 0.88999, output: '89.00%'},]  
+    {input: 0.88999, output: '89.00%'},],
+  progressFloatingPointValues = [
+      {input: 0.14, output: '14%'},
+      {input: 0.148, output: '14.8%'},
+      {input: 0.1414, output: '14.14%'},
+      {input: 0.141414, output: '14.14%'},
+      {input: 0.29, output: '29%'},
+      {input: 0.58, output: '58%'},
+      {input: 0.592, output: '59.2%'},]       
 
 describe('ProgressTableCellType.tsx', () => {
 
@@ -42,10 +50,19 @@ describe('ProgressTableCellType.tsx', () => {
 
   it('Renders data-test attr with decimal values', () => {
     const { queryByTestId, rerender } = render(<XProgressTableCellType model={progressCellProps} progress={progress} />)
-    progressValues.map(progressValue => {
+    progressValues.forEach(progressValue => {
       rerender(<XProgressTableCellType model={progressCellProps} progress={progressValue.input} />)
       expect(queryByTestId(name)).toBeInTheDocument()
       expect(queryByTestId(name)).toHaveTextContent(progressValue.output)      
     })
-  })  
-})
+  })
+
+  it('Handle potential floating-point decimal errors', () => {
+    const { queryByTestId, rerender } = render(<XProgressTableCellType model={progressCellProps} progress={progress} />)
+    progressFloatingPointValues.forEach(progressValue => {
+      rerender(<XProgressTableCellType model={progressCellProps} progress={progressValue.input} />)
+      expect(queryByTestId(name)).toBeInTheDocument()
+      expect(queryByTestId(name)).toHaveTextContent(progressValue.output)      
+    })
+  })   
+})
diff --git a/ui/src/progress_table_cell_type.tsx b/ui/src/progress_table_cell_type.tsx
@@ -50,7 +50,7 @@ export const XProgressTableCellType = ({ model: m, progress }: { model: Progress
   <div data-test={m.name} className={css.container}>
     <ProgressArc thickness={2} color={cssVar(m.color || '$red')} value={progress} />
     <Fluent.Stack horizontalAlign='center' verticalAlign='center' className={clas(css.percentContainer, 'wave-s12')}>
-      <div className={css.percent}>{`${Number.isInteger(progress * 1000) ? (progress * 100) : (progress * 100).toFixed(2)}%`}</div>
+      <div className={css.percent}>{`${Number.isInteger(progress * 1000) ? (progress * 1000)/10 : (progress * 100).toFixed(2)}%`}</div>
     </Fluent.Stack>
   </div >
 )