diff --git a/lib/web_ui/lib/src/engine/canvas_pool.dart b/lib/web_ui/lib/src/engine/canvas_pool.dart index fefcf14b13bfb..9df8d14f9eb82 100644 --- a/lib/web_ui/lib/src/engine/canvas_pool.dart +++ b/lib/web_ui/lib/src/engine/canvas_pool.dart @@ -503,7 +503,7 @@ class _CanvasPool extends _SaveStackTracking { break; case PathCommandTypes.ellipse: final Ellipse ellipse = command; - ctx.ellipse( + DomRenderer.ellipse(ctx, ellipse.x, ellipse.y, ellipse.radiusX, @@ -563,14 +563,14 @@ class _CanvasPool extends _SaveStackTracking { void drawOval(ui.Rect rect, ui.PaintingStyle style) { context.beginPath(); - context.ellipse(rect.center.dx, rect.center.dy, rect.width / 2, + DomRenderer.ellipse(context, rect.center.dx, rect.center.dy, rect.width / 2, rect.height / 2, 0, 0, 2.0 * math.pi, false); contextHandle.paint(style); } void drawCircle(ui.Offset c, double radius, ui.PaintingStyle style) { context.beginPath(); - context.ellipse(c.dx, c.dy, radius, radius, 0, 0, 2.0 * math.pi, false); + DomRenderer.ellipse(context, c.dx, c.dy, radius, radius, 0, 0, 2.0 * math.pi, false); contextHandle.paint(style); } diff --git a/lib/web_ui/lib/src/engine/dom_renderer.dart b/lib/web_ui/lib/src/engine/dom_renderer.dart index dbabe49f4d189..8e2f585b83f20 100644 --- a/lib/web_ui/lib/src/engine/dom_renderer.dart +++ b/lib/web_ui/lib/src/engine/dom_renderer.dart @@ -489,6 +489,26 @@ flt-glass-pane * { } } + static bool _ellipseFeatureDetected; + + /// Draws CanvasElement ellipse with fallback. + static void ellipse(html.CanvasRenderingContext2D context, + double centerX, double centerY, double radiusX, double radiusY, + double rotation, double startAngle, double endAngle, bool antiClockwise) { + _ellipseFeatureDetected ??= js_util.getProperty(context, 'ellipse') != null; + if (_ellipseFeatureDetected) { + context.ellipse(centerX, centerY, radiusX, radiusY, + rotation, startAngle, endAngle, antiClockwise); + } else { + context.save(); + context.translate(centerX, centerY); + context.rotate(rotation); + context.scale(radiusX, radiusY); + context.arc(0, 0, 1, startAngle, endAngle, antiClockwise); + context.restore(); + } + } + /// The element corresponding to the only child of the root surface. html.Element get _rootApplicationElement { final html.Element lastElement = rootElement.children.last; diff --git a/lib/web_ui/lib/src/engine/rrect_renderer.dart b/lib/web_ui/lib/src/engine/rrect_renderer.dart index 628dfcf46d3dd..79e2377706042 100644 --- a/lib/web_ui/lib/src/engine/rrect_renderer.dart +++ b/lib/web_ui/lib/src/engine/rrect_renderer.dart @@ -196,7 +196,7 @@ class _RRectToCanvasRenderer extends _RRectRenderer { void ellipse(double centerX, double centerY, double radiusX, double radiusY, double rotation, double startAngle, double endAngle, bool antiClockwise) { - context.ellipse(centerX, centerY, radiusX, radiusY, rotation, startAngle, + DomRenderer.ellipse(context, centerX, centerY, radiusX, radiusY, rotation, startAngle, endAngle, antiClockwise); } } diff --git a/lib/web_ui/lib/src/engine/text/font_collection.dart b/lib/web_ui/lib/src/engine/text/font_collection.dart index 52a3ec8125223..95e8d4e684595 100644 --- a/lib/web_ui/lib/src/engine/text/font_collection.dart +++ b/lib/web_ui/lib/src/engine/text/font_collection.dart @@ -245,7 +245,9 @@ class _PolyfillFontManager extends FontManager { paragraph.style.position = 'absolute'; paragraph.style.visibility = 'hidden'; paragraph.style.fontSize = '72px'; - paragraph.style.fontFamily = 'sans-serif'; + final String fallbackFontName = browserEngine == BrowserEngine.ie11 ? + 'Times New Roman' : 'sans-serif'; + paragraph.style.fontFamily = fallbackFontName; if (descriptors['style'] != null) { paragraph.style.fontStyle = descriptors['style']; } @@ -257,7 +259,7 @@ class _PolyfillFontManager extends FontManager { html.document.body.append(paragraph); final int sansSerifWidth = paragraph.offsetWidth; - paragraph.style.fontFamily = "'$family', sans-serif"; + paragraph.style.fontFamily = "'$family', $fallbackFontName"; final Completer completer = Completer(); @@ -269,8 +271,10 @@ class _PolyfillFontManager extends FontManager { completer.complete(); } else { if (DateTime.now().difference(_fontLoadStart) > _fontLoadTimeout) { - completer.completeError( - Exception('Timed out trying to load font: $family')); + // Let application waiting for fonts continue with fallback. + completer.complete(); + // Throw unhandled exception for logging. + throw Exception('Timed out trying to load font: $family'); } else { Timer(_fontLoadRetryDuration, _watchWidth); }