basalt-appkit 0.0.0-rc5

package/native/tests/test_appkit_titlebar.mm

@@ -0,0 +1,107 @@
+// The title bar's metrics, which are the only part of it a test can reach.
+//
+// What the two styles *look* like is in the screenshots that went with phase
+// 58; what is assertable is the arithmetic an app lays itself out against, and
+// that arithmetic is the whole contract src/TitleBar.js has with the host.
+//
+// A real NSWindow, never ordered front. Its metrics are a property of the
+// window rather than of anything on screen, so nothing here has to be shown.
+
+#include "TestHarness.h"
+
+#include <sstream>
+
+#import "AppKitTitleBar.h"
+
+TEST(titlebar_native_style_costs_the_app_nothing) {
+  @autoreleasepool {
+    NSWindow *window = [[NSWindow alloc]
+        initWithContentRect:NSMakeRect(0, 0, 400, 300)
+                  styleMask:NSWindowStyleMaskTitled | NSWindowStyleMaskClosable |
+                            NSWindowStyleMaskMiniaturizable | NSWindowStyleMaskResizable
+                    backing:NSBackingStoreBuffered
+                      defer:NO];
+    basalt::titleBar().attach(window);
+    basalt::titleBar().setStyle(basalt::TitleBarStyle::Native);
+
+    // The system's title bar sits outside the content view, so it takes
+    // nothing from the app and there is nothing to leave clear. Windows
+    // reports the same zeroes for the same reason.
+    const auto metrics = basalt::titleBar().metrics();
+    EXPECT(metrics.style == basalt::TitleBarStyle::Native);
+    EXPECT_EQ(metrics.height, 0.0);
+    EXPECT_EQ(metrics.buttonsWidth, 0.0);
+  }
+}
+
+TEST(titlebar_hidden_style_reports_what_to_leave_clear) {
+  @autoreleasepool {
+    NSWindow *window = [[NSWindow alloc]
+        initWithContentRect:NSMakeRect(0, 0, 400, 300)
+                  styleMask:NSWindowStyleMaskTitled | NSWindowStyleMaskClosable |
+                            NSWindowStyleMaskMiniaturizable | NSWindowStyleMaskResizable
+                    backing:NSBackingStoreBuffered
+                      defer:NO];
+    basalt::titleBar().attach(window);
+    basalt::titleBar().setStyle(basalt::TitleBarStyle::Hidden);
+
+    const auto metrics = basalt::titleBar().metrics();
+    EXPECT(metrics.style == basalt::TitleBarStyle::Hidden);
+    // A real height rather than a guess: the content view now extends under
+    // the title bar, and this is how much of it the app must not fill.
+    EXPECT(metrics.height > 0.0);
+    // And the traffic lights, which the system keeps drawing over the app's
+    // own header -- the counterpart of the caption buttons on Windows.
+    EXPECT(metrics.buttonsWidth > 0.0);
+
+    // The window really did take the style, rather than the metrics being
+    // computed from a flag nothing acted on.
+    EXPECT((window.styleMask & NSWindowStyleMaskFullSizeContentView) != 0);
+    EXPECT(window.titlebarAppearsTransparent);
+
+    // And back, so a request that is unmounted restores the window.
+    basalt::titleBar().setStyle(basalt::TitleBarStyle::Native);
+    EXPECT((window.styleMask & NSWindowStyleMaskFullSizeContentView) == 0);
+    EXPECT_EQ(basalt::titleBar().metrics().height, 0.0);
+  }
+}
+
+TEST(titlebar_takes_a_title_and_a_colour) {
+  @autoreleasepool {
+    NSWindow *window = [[NSWindow alloc]
+        initWithContentRect:NSMakeRect(0, 0, 400, 300)
+                  styleMask:NSWindowStyleMaskTitled | NSWindowStyleMaskClosable
+                    backing:NSBackingStoreBuffered
+                      defer:NO];
+    basalt::titleBar().attach(window);
+    basalt::titleBar().setStyle(basalt::TitleBarStyle::Native);
+    basalt::titleBar().setTitle(std::string("Inbox"));
+    EXPECT([window.title isEqualToString:@"Inbox"]);
+
+    // A dark caption asks for the dark appearance, because AppKit has no
+    // caption text colour of its own -- the appearance is what decides it.
+    basalt::titleBar().setColors(0xFF1A1E28u, std::nullopt, std::nullopt);
+    EXPECT(window.titlebarAppearsTransparent);
+    EXPECT([window.appearance.name isEqualToString:NSAppearanceNameDarkAqua]);
+
+    // And a light one asks for the light appearance.
+    basalt::titleBar().setColors(0xFFF5F5F5u, std::nullopt, std::nullopt);
+    EXPECT([window.appearance.name isEqualToString:NSAppearanceNameAqua]);
+  }
+}
+
+// The caption buttons' functions. What they do was checked live -- a probe
+// drove the window from 900x700 to maximised and back, then minimised and
+// closed it. What a test pins is the half with no window on the other end: the
+// module outlives the window at shutdown, and a call arriving then must not
+// take the process with it.
+TEST(titlebar_actions_are_safe_with_no_window) {
+  @autoreleasepool {
+    basalt::titleBar().attach(nil);
+    basalt::titleBar().minimize();
+    basalt::titleBar().toggleMaximize();
+    basalt::titleBar().close();
+    basalt::titleBar().startDrag();
+    EXPECT(true);
+  }
+}

package/native/tests/test_appkit_view.mm

@@ -0,0 +1,237 @@
+// Tests for the macOS view layer.
+//
+// RnAppKitView has no React Native dependency, so these need no Fabric machinery
+// and no window. They share the toolkit-free harness the GTK tests use, which
+// is the first small piece of evidence that a second platform can reuse what is
+// here rather than reimplement it.
+
+#include "TestHarness.h"
+
+#import "RnAppKitView.h"
+
+#include <sstream>
+
+namespace {
+
+// Components of a layer's background colour, or all -1 if it has none.
+struct Background {
+  CGFloat r = -1, g = -1, b = -1, a = -1;
+  bool present = false;
+};
+
+Background backgroundOf(RnAppKitView *view) {
+  Background result;
+  CGColorRef color = view.layer.backgroundColor;
+  if (color == nullptr) {
+    return result;
+  }
+  const CGFloat *components = CGColorGetComponents(color);
+  result.present = true;
+  result.r = components[0];
+  result.g = components[1];
+  result.b = components[2];
+  result.a = components[3];
+  return result;
+}
+
+RnAppKitView *box(NSInteger tag, CGFloat x, CGFloat y, CGFloat w, CGFloat h) {
+  RnAppKitView *view = [RnAppKitView viewWithTag:tag];
+  [view setRnFrameX:x y:y width:w height:h];
+  return view;
+}
+
+NSInteger tagOfSubview(RnAppKitView *parent, NSUInteger index) {
+  return ((RnAppKitView *)parent.subviews[index]).rnTag;
+}
+
+} // namespace
+
+TEST(appkit_view_stores_its_tag_and_frame) {
+  @autoreleasepool {
+    RnAppKitView *view = box(7, 1.5, 2.5, 30, 40);
+
+    EXPECT_EQ((long)view.rnTag, 7L);
+    EXPECT_NEAR(view.frame.origin.x, 1.5, 0.001);
+    EXPECT_NEAR(view.frame.origin.y, 2.5, 0.001);
+    EXPECT_NEAR(view.frame.size.width, 30.0, 0.001);
+    EXPECT_NEAR(view.frame.size.height, 40.0, 0.001);
+  }
+}
+
+// The reason the view exists at all. AppKit's origin is bottom-left; every
+// frame Fabric produces assumes top-left, so a child at y=32 in a 420-tall
+// parent must sit 32 from the top and not 32 from the bottom.
+TEST(appkit_view_is_flipped_so_frames_are_top_left) {
+  @autoreleasepool {
+    RnAppKitView *parent = box(1, 0, 0, 640, 420);
+    RnAppKitView *child = box(2, 32, 32, 240, 160);
+    [parent insertRnChild:child atIndex:0];
+
+    EXPECT(parent.isFlipped);
+
+    // The child's own origin, expressed in the parent. Unflipped this would be
+    // 228 -- 420 - 32 - 160 -- which is the bug in numbers.
+    const NSPoint origin = [child convertPoint:NSZeroPoint toView:parent];
+    EXPECT_NEAR(origin.x, 32.0, 0.001);
+    EXPECT_NEAR(origin.y, 32.0, 0.001);
+  }
+}
+
+TEST(appkit_view_children_insert_at_the_requested_index) {
+  @autoreleasepool {
+    RnAppKitView *parent = box(1, 0, 0, 100, 100);
+    RnAppKitView *a = box(10, 0, 0, 10, 10);
+    RnAppKitView *b = box(11, 0, 0, 10, 10);
+    RnAppKitView *c = box(12, 0, 0, 10, 10);
+
+    [parent insertRnChild:a atIndex:0];
+    [parent insertRnChild:b atIndex:1];
+    // Into the middle, which is the case an append-only implementation passes
+    // every other test without handling.
+    [parent insertRnChild:c atIndex:1];
+
+    EXPECT_EQ((long)parent.subviews.count, 3L);
+    EXPECT_EQ((long)tagOfSubview(parent, 0), 10L);
+    EXPECT_EQ((long)tagOfSubview(parent, 1), 12L);
+    EXPECT_EQ((long)tagOfSubview(parent, 2), 11L);
+
+    [parent removeRnChild:c];
+    EXPECT_EQ((long)parent.subviews.count, 2L);
+    EXPECT_EQ((long)tagOfSubview(parent, 0), 10L);
+    EXPECT_EQ((long)tagOfSubview(parent, 1), 11L);
+
+    // Removed, not destroyed: a reinsertion elsewhere has to still work.
+    EXPECT(c.superview == nil);
+    RnAppKitView *other = box(2, 0, 0, 100, 100);
+    [other insertRnChild:c atIndex:0];
+    EXPECT_EQ((long)tagOfSubview(other, 0), 12L);
+  }
+}
+
+// Removing a view that is not ours must not detach it from whoever owns it.
+TEST(appkit_view_removes_only_its_own_child) {
+  @autoreleasepool {
+    RnAppKitView *owner = box(1, 0, 0, 100, 100);
+    RnAppKitView *stranger = box(2, 0, 0, 100, 100);
+    RnAppKitView *child = box(10, 0, 0, 10, 10);
+
+    [owner insertRnChild:child atIndex:0];
+    [stranger removeRnChild:child];
+
+    EXPECT_EQ((long)owner.subviews.count, 1L);
+    EXPECT(child.superview == owner);
+  }
+}
+
+TEST(appkit_view_background_reaches_the_layer) {
+  @autoreleasepool {
+    RnAppKitView *view = box(1, 0, 0, 10, 10);
+    EXPECT(!backgroundOf(view).present);
+
+    [view setRnBackgroundColorRed:0.25 green:0.5 blue:0.75 alpha:0.5 hasColor:YES];
+    const Background set = backgroundOf(view);
+    EXPECT(set.present);
+    EXPECT_NEAR(set.r, 0.25, 0.001);
+    EXPECT_NEAR(set.g, 0.5, 0.001);
+    EXPECT_NEAR(set.b, 0.75, 0.001);
+    EXPECT_NEAR(set.a, 0.5, 0.001);
+
+    // sRGB, not the display's space. The same colour has to come out the same
+    // on a wide-gamut Mac as it does on Linux, or "consistent across platforms"
+    // stops being true in the one place nobody thinks to check.
+    CGColorSpaceRef space = CGColorGetColorSpace(view.layer.backgroundColor);
+    CFStringRef name = CGColorSpaceCopyName(space);
+    EXPECT(name != nullptr && CFEqual(name, kCGColorSpaceSRGB));
+    if (name != nullptr) {
+      CFRelease(name);
+    }
+
+    // No background is not transparent black: the layer must have no colour at
+    // all, so whatever is behind it shows through unmodified.
+    [view setRnBackgroundColorRed:0.25 green:0.5 blue:0.75 alpha:0.5 hasColor:NO];
+    EXPECT(!backgroundOf(view).present);
+  }
+}
+
+TEST(appkit_view_opacity_clipping_and_radius_reach_the_layer) {
+  @autoreleasepool {
+    RnAppKitView *view = box(1, 0, 0, 10, 10);
+
+    EXPECT_NEAR(view.layer.opacity, 1.0, 0.001);
+    EXPECT(!view.layer.masksToBounds);
+    EXPECT_NEAR(view.layer.cornerRadius, 0.0, 0.001);
+
+    [view setRnOpacity:0.4];
+    [view setRnClipsChildren:YES];
+    [view setRnCornerRadius:8];
+
+    EXPECT_NEAR(view.layer.opacity, 0.4, 0.001);
+    EXPECT(view.layer.masksToBounds);
+    EXPECT_NEAR(view.layer.cornerRadius, 8.0, 0.001);
+  }
+}
+
+// A scroll offset moves the children and leaves their frames alone. Through
+// bounds.origin, so AppKit shifts drawing, clipping and hit testing together --
+// an implementation that moved each child instead would have to undo it on
+// every mutation, and would fight the frames Yoga produced.
+TEST(appkit_scroll_offset_moves_children_without_moving_their_frames) {
+  @autoreleasepool {
+    RnAppKitView *page = box(99, 0, 0, 400, 400);
+    RnAppKitView *scroller = box(1, 0, 0, 200, 100);
+    RnAppKitView *content = box(2, 0, 0, 200, 600);
+    [page insertRnChild:scroller atIndex:0];
+    [scroller insertRnChild:content atIndex:0];
+
+    // Measured against the *page*, not the scroller. A view's own coordinate
+    // system is its bounds space, so converting into the scroller would report
+    // the frame back unchanged however far it had scrolled -- which is exactly
+    // the wrong question, and the first version of this test asked it.
+    EXPECT_NEAR(scroller.rnScrollOffset.y, 0.0, 0.001);
+    EXPECT_NEAR([content convertPoint:NSZeroPoint toView:page].y, 0.0, 0.001);
+
+    [scroller setRnScrollOffsetX:0 y:150];
+
+    EXPECT_NEAR(scroller.rnScrollOffset.y, 150.0, 0.001);
+    // The frame is untouched: it is still what the shadow tree assigned.
+    EXPECT_NEAR(content.frame.origin.y, 0.0, 0.001);
+    // But it now sits 150 above the scroller's visible top.
+    EXPECT_NEAR([content convertPoint:NSZeroPoint toView:page].y, -150.0, 0.001);
+  }
+}
+
+TEST(appkit_scroll_offset_is_reported_in_the_tree) {
+  @autoreleasepool {
+    RnAppKitView *scroller = box(1, 0, 0, 200, 100);
+    [scroller setRnScrollOffsetX:0 y:40];
+
+    const std::string described = [scroller describeTree].UTF8String;
+    // The same `scroll=(x,y)` the GTK side emits, so a scrolled list shows up
+    // in the cross-platform diff.
+    EXPECT(described.find("scroll=(0,40)") != std::string::npos);
+  }
+}
+
+// The same format the GTK side emits, character for character, so the two
+// platforms can be compared without reading two renderers.
+TEST(appkit_view_describes_its_tree_like_the_gtk_one) {
+  @autoreleasepool {
+    RnAppKitView *root = box(1, 0, 0, 640, 420);
+    [root setRnBackgroundColorRed:0.12 green:0.13 blue:0.16 alpha:1.0 hasColor:YES];
+
+    RnAppKitView *child = box(2, 32, 32, 240, 160);
+    [child setRnOpacity:0.4];
+    [child setRnClipsChildren:YES];
+    [root insertRnChild:child atIndex:0];
+
+    const std::string described = [root describeTree].UTF8String;
+    const std::string expected =
+        "view tag=1 frame=(0,0 640x420) bg=#1f2129ff\n"
+        "  view tag=2 frame=(32,32 240x160) opacity=0.4 clip\n";
+    EXPECT_EQ(described, expected);
+  }
+}
+
+int main(int argc, char **argv) {
+  return basalt::testing::runAllTests(argc, argv);
+}

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "basalt-appkit",
+  "version": "0.0.0-rc5",
+  "description": "The macOS view layer for basalt-core: an AppKit view layer, a Fabric mounting manager, and a host. Everything behind them is in basalt-core.",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vincentvella/basalt-core.git",
+    "directory": "packages/basalt-appkit"
+  },
+  "exports": {
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "cli",
+    "native",
+    "react-native.config.js"
+  ],
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "dependencies": {
+    "basalt-core": "0.0.0-rc5"
+  }
+}

package/react-native.config.js

@@ -0,0 +1,22 @@
+/**
+ * What React Native's CLI reads out of this package.
+ *
+ * Just the `run-macos` command. The platform *declarations* -- which make
+ * `--platform` accept this one at all -- are in basalt-core, because
+ * they are the same on every desktop and an app targeting only one of them
+ * still needs them.
+ *
+ * The CLI reads a react-native.config.js out of every dependency and merges
+ * them, so an app with more than one of these packages installed gets the
+ * platforms from the shared one and a command from each of the others, without
+ * any of them knowing about the rest.
+ *
+ * @format
+ */
+
+// @ts-check
+'use strict';
+
+module.exports = {
+  commands: [require('./cli/runMacos')],
+};