Repository: flutter
Issue: [flutter_svg] [Bug] Rendering regressions when upgrading from flutter_svg 1.1.6 to 2.0.7
Labels: package,P3,p: flutter_svg

_Imported from https://github.com/dnfield/flutter_svg/issues/994_

Original report by @androidseb on Oct 7, 2023

I use a large collection of icons in my product, mostly icons listed [here](https://github.com/androidseb/openmoji/tree/map_marker_monochrome_icons/map_marker_monochrome).

I have some golden tests to check for regressions, and when upgrading flutter_svg from 1.1.6 to 2.0.7, I noticed a few regressions that I thought might be helpful to report here. I consider these regressions bugs because the rendering elsewhere (e.g. Chrome browser, Inkscape) seems to be correct.

## Regression 1

### SVG file

![openmoji_curly_hair](https://github.com/dnfield/flutter_svg/assets/5169269/9852ef21-b388-4649-851e-9e91ce662a44)

### Rendering on 1.1.6 (PNG)

![openmoji_curly_hair_before](https://github.com/dnfield/flutter_svg/assets/5169269/e3c3c324-4bd1-4b8d-873e-ff3e4c8066c5)

### Rendering on 2.0.7 (PNG)

![openmoji_curly_hair_after](https://github.com/dnfield/flutter_svg/assets/5169269/48ffaae7-1225-4029-924b-e14f5c86432f)

## Regression 2

### SVG file

![openmoji_prayer_beads](https://github.com/dnfield/flutter_svg/assets/5169269/761031b4-4678-4e38-9c8c-a181e9512750)

### Rendering on 1.1.6 (PNG)

![openmoji_prayer_beads_before](https://github.com/dnfield/flutter_svg/assets/5169269/332d37aa-1afb-438e-87a0-4240d8d47da2)

### Rendering on 2.0.7 (PNG)

![openmoji_prayer_beads_after](https://github.com/dnfield/flutter_svg/assets/5169269/bfa4cd3e-8e54-401f-b522-2aa73a9b808d)

## Regression 3

### SVG file

![openmoji_woman_gesturing_ok](https://github.com/dnfield/flutter_svg/assets/5169269/37b5c821-d83b-46de-bc5e-19b391296f83)

### Rendering on 1.1.6 (PNG)

![openmoji_woman_gesturing_before](https://github.com/dnfield/flutter_svg/assets/5169269/900cda37-ae15-4eaf-a16e-7e59d1f1dc5c)

### Rendering on 2.0.7 (PNG)

![openmoji_woman_gesturing_ok_after](https://github.com/dnfield/flutter_svg/assets/5169269/e52cedc7-e60b-4807-9a98-9e2e62228b5d)

## Additional notes

It appears to be a bug in the library, but in case I'm misusing anything, here is the code I use to produce those PNG images:

```dart
  static Future<Uint8List> _svgStringToPngBytes(
    String svgStringContent,
  ) async {
    const double targetWidth = 32;
    const double targetHeight= 32;
    const double devicePixelRatio = 3;
    const double scaledTargetWidth = targetWidth * devicePixelRatio;
    const double scaledTargetHeight = targetHeight * devicePixelRatio;
    final SvgStringLoader svgStringLoader = SvgStringLoader(svgStringContent);
    final PictureInfo pictureInfo = await vg.loadPicture(svgStringLoader, null);
    final double svgWidth = pictureInfo.size.width;
    final double svgHeight = pictureInfo.size.height;
    final ui.Picture picture = pictureInfo.picture;
    final ui.PictureRecorder recorder = ui.PictureRecorder();
    final ui.Canvas canvas = Canvas(recorder, Rect.fromPoints(Offset.zero, Offset(svgWidth, svgHeight)));
    final double scaleFactor = math.min(
      scaledTargetWidth / svgWidth,
      scaledTargetHeight / svgHeight,
    );
    final double scaledSvgWidth = svgWidth * scaleFactor;
    final double scaledSvgHeight = svgHeight * scaleFactor;
    canvas.translate(
      (scaledTargetWidth - scaledSvgWidth) / 2,
      (scaledTargetHeight - scaledSvgHeight) / 2,
    );
    canvas.scale(scaleFactor, scaleFactor);
    canvas.drawPicture(picture);
    final ui.Image imgByteData = await recorder.endRecording().toImage(
          scaledTargetWidth.ceil(),
          scaledTargetHeight.ceil(),
        );
    final ByteData? bytesData = await imgByteData.toByteData(format: ui.ImageByteFormat.png);
    final Uint8List imageData = bytesData?.buffer.asUint8List() ?? Uint8List(0);
    pictureInfo.picture.dispose();
    return imageData;
  }
```

---
Comment by @fisforfaheem on Oct 17, 2023
sME ISSUE

---
Comment by @dnfield on Oct 17, 2023
Is this code run via `flutter test` or some other method?

---
Comment by @androidseb on Oct 18, 2023
@dnfield this code that produced these PNG images supplied in this issue's description was run via `flutter test`, but I can also confirm that the same behavior occurs on real devices, running on Android, iOS or Web.

---
Comment by @androidseb on Apr 4, 2024
Just adding a quick update here, this is still an issue on the latest version of Flutter today (Flutter 3.19.5).