Files
buzz/mobile/test/shared/widgets/avatar_image_test.dart
b30f1f6129 Polish mobile profiles, DMs, and sheets (#5401)
## Summary
- add poster-first, tap-to-toggle animated avatars on profile surfaces
while preserving transparent/static behavior elsewhere
- align mobile DM headers, membership actions, and invisible agent
recipient addressing with established desktop semantics
- polish titled sheets and status editing, preserve native iOS sheet
corners, and batch relay reads to improve review-build responsiveness

## Snapshots

<table>
  <tr>
    <th>Profile avatar</th>
    <th>Agent DM header and composer</th>
  </tr>
  <tr>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--profile-avatar.png"
width="360" alt="Mobile profile settings with animated avatar
surface"></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--agent-dm.png"
width="360" alt="Agent direct message with masked presence and normal
composer"></td>
  </tr>
  <tr>
    <th>Members sheet</th>
    <th>Status editor</th>
  </tr>
  <tr>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--members-sheet.png"
width="360" alt="Members bottom sheet with centered title and padded
content"></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--status-sheet.png"
width="360" alt="Status editor bottom sheet with duration and quick
statuses"></td>
  </tr>
  <tr>
    <th colspan="2">Switch Community</th>
  </tr>
  <tr>
<td colspan="2" align="center"><img
src="https://raw.githubusercontent.com/block/buzz/e8de7495451dbe1a393ab43c5e204ca7425f2ba5/pr-5401--switch-community.png"
width="720" alt="Switch Community bottom sheet with centered title and
aligned Edit action"></td>
  </tr>
</table>

## Validation
- `just mobile-check`
- `just mobile-test` (1,283 tests)
- installed and reviewed isolated debug builds on iPhone and Pixel

---------

Signed-off-by: kenny lopez <klopez4212@gmail.com>
Signed-off-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz>
Signed-off-by: Kenny Lopez <klopez4212@gmail.com>
Signed-off-by: Wes <wesbillman@users.noreply.github.com>
Co-authored-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz>
Co-authored-by: Wes <wesbillman@users.noreply.github.com>
Co-authored-by: Carl <c7ebe626f000404285d3686e1dc74cc07cc60a9754a150041ba132e14bd3e2ec@buzz.block.builderlab.xyz>
2026-08-13 20:16:04 -07:00

101 lines
3.6 KiB
Dart

import 'dart:convert';
import 'package:buzz/shared/widgets/avatar_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
void main() {
const svg =
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">'
'<text x="16" y="24" text-anchor="middle">🦝</text></svg>';
Widget subject(String? imageUrl, {Color? backgroundColor}) => ProviderScope(
child: MaterialApp(
home: AvatarImage(
imageUrl: imageUrl,
radius: 16,
backgroundColor: backgroundColor,
fallback: const Text('R'),
),
),
);
testWidgets('renders raccoon percent-encoded SVG data avatar', (
tester,
) async {
const raccoonAvatar =
'data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Crect%20width%3D%22512%22%20height%3D%22512%22%20rx%3D%22256%22%20fill%3D%22%233399FF%22%2F%3E%3Ctext%20x%3D%2250%25%22%20y%3D%2256%25%22%20dominant-baseline%3D%22middle%22%20text-anchor%3D%22middle%22%20font-size%3D%22258%22%3E%F0%9F%A6%9D%3C%2Ftext%3E%3C%2Fsvg%3E';
await tester.pumpWidget(subject(raccoonAvatar));
await tester.pumpAndSettle();
final emoji = tester.widget<Text>(find.text('🦝'));
expect(emoji.style?.height, 1);
expect(find.byType(SvgPicture), findsNothing);
expect(find.text('R'), findsNothing);
expect(tester.takeException(), isNull);
});
testWidgets('renders base64 SVG data avatar', (tester) async {
await tester.pumpWidget(
subject('data:image/svg+xml;base64,${base64Encode(utf8.encode(svg))}'),
);
expect(find.byType(SvgPicture), findsOneWidget);
});
testWidgets('centers fallback when no avatar is configured', (tester) async {
await tester.pumpWidget(subject(null));
final avatarCenter = tester.getCenter(find.byType(CircleAvatar));
final fallbackCenter = tester.getCenter(find.text('R'));
expect(fallbackCenter, avatarCenter);
});
testWidgets('uses fallback for malformed image data', (tester) async {
await tester.pumpWidget(subject('data:image/svg+xml;base64,%%%'));
expect(find.text('R'), findsOneWidget);
});
testWidgets('renders animated-avatar posters without an opaque background', (
tester,
) async {
const posterUrl = 'https://relay.example/media/poster.png';
const animationUrl = 'https://relay.example/media/animation.png';
final animatedUrl =
'$posterUrl#buzz-anim=${Uri.encodeComponent(animationUrl)}';
await tester.pumpWidget(subject(animatedUrl, backgroundColor: Colors.red));
expect(
tester.widget<CircleAvatar>(find.byType(CircleAvatar)).backgroundColor,
Colors.transparent,
);
expect(
tester
.widget<AvatarImageContent>(find.byType(AvatarImageContent))
.imageUrl,
posterUrl,
);
});
testWidgets('reuses parsed raster bytes across parent rebuilds', (
tester,
) async {
const png =
'data:image/png;base64,'
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=';
await tester.pumpWidget(subject(png));
final firstBytes = tester.widget<Image>(find.byType(Image)).image;
await tester.pumpWidget(subject(png));
final rebuiltBytes = tester.widget<Image>(find.byType(Image)).image;
final firstMemory = firstBytes as MemoryImage;
final rebuiltMemory = rebuiltBytes as MemoryImage;
expect(rebuiltMemory.bytes, same(firstMemory.bytes));
});
}