feat: support context alpha

__test__/draw.spec.ts

@@ -16,6 +16,12 @@ test.beforeEach((t) => {
   t.context.ctx = canvas.getContext('2d')!
 })
 
+test('alpha-false', async (t) => {
+  const canvas = createCanvas(512, 512)
+  const ctx = canvas.getContext('2d', { alpha: false })
+  await snapshotImage(t, { canvas, ctx })
+})
+
 test('arc', async (t) => {
   const { ctx } = t.context
   ctx.beginPath()
@@ -285,10 +291,16 @@ test('fillRect', async (t) => {
 test.todo('fillText')
 
 test('getContextAttributes', (t) => {
-  const { ctx } = t.context
-  const attributes = ctx.getContextAttributes()
-  t.is(attributes.alpha, true)
-  t.is(attributes.desynchronized, false)
+  const defaultCtx = t.context.ctx
+  const defaultAttrs = defaultCtx.getContextAttributes()
+  t.is(defaultAttrs.alpha, true)
+  t.is(defaultAttrs.desynchronized, false)
+
+  const canvas = createCanvas(512, 512)
+  const ctx = canvas.getContext('2d', { alpha: false })
+  const customAttrs = ctx.getContextAttributes()
+  t.is(customAttrs.alpha, false)
+  t.is(customAttrs.desynchronized, false)
 })
 
 test('getImageData', async (t) => {

__test__/image-snapshot.ts

@@ -6,9 +6,9 @@ import { ExecutionContext } from 'ava'
 
 const png = PNG()
 
-export async function snapshotImage<C>(t: ExecutionContext<C>) {
+export async function snapshotImage<C>(t: ExecutionContext<C>, context = t.context) {
   // @ts-expect-error
-  const { canvas } = t.context
+  const { canvas } = context
   const image = await canvas.png()
   const p = join(__dirname, 'snapshots', `${t.title}.png`)
 

index.d.ts

@@ -77,7 +77,7 @@ export interface SKRSContext2D extends Omit<CanvasRenderingContext2D, 'drawImage
 }
 
 export interface Canvas extends Omit<HTMLCanvasElement, 'getContext'> {
-  getContext(contextId: '2d'): SKRSContext2D
+  getContext(contextType: '2d', contextAttributes?: { alpha: boolean }): SKRSContext2D
   png(): Promise<Buffer>
 }
 

src/ctx.rs

@@ -23,6 +23,7 @@ impl From<SkError> for Error {
 pub struct Context {
   pub(crate) surface: Surface,
   path: Path,
+  pub alpha: bool,
   pub(crate) states: Vec<Context2dRenderingState>,
 }
 
@@ -129,6 +130,7 @@ impl Context {
     states.push(Context2dRenderingState::default());
     Ok(Context {
       surface,
+      alpha: true,
       path: Path::new(),
       states,
     })
@@ -253,7 +255,7 @@ impl Context {
   }
 
   #[inline(always)]
-  fn fill_paint(&self) -> result::Result<Paint, SkError> {
+  pub fn fill_paint(&self) -> result::Result<Paint, SkError> {
     let current_paint = &self.states.last().unwrap().paint;
     let mut paint = current_paint.clone();
     paint.set_style(PaintStyle::Fill);
@@ -688,8 +690,10 @@ fn draw_image(ctx: CallContext) -> Result<JsUndefined> {
 
 #[js_function]
 fn get_context_attributes(ctx: CallContext) -> Result<JsObject> {
+  let this = ctx.this_unchecked::<JsObject>();
+  let context_2d = ctx.env.unwrap::<Context>(&this)?;
   let mut obj = ctx.env.create_object()?;
-  obj.set_named_property("alpha", ctx.env.get_boolean(true)?)?;
+  obj.set_named_property("alpha", ctx.env.get_boolean(context_2d.alpha)?)?;
   obj.set_named_property("desynchronized", ctx.env.get_boolean(false)?)?;
   Ok(obj)
 }

src/lib.rs

@@ -2,6 +2,7 @@
 extern crate napi_derive;
 
 use napi::*;
+use std::convert::TryInto;
 
 use ctx::{Context, ContextData};
 use sk::SurfaceDataRef;
@@ -68,7 +69,7 @@ fn canvas_element_constructor(ctx: CallContext) -> Result<JsUndefined> {
   ctx.env.get_undefined()
 }
 
-#[js_function(1)]
+#[js_function(2)]
 fn get_context(ctx: CallContext) -> Result<JsObject> {
   let context_type = ctx.get::<JsString>(0)?.into_utf8()?;
   if context_type.as_str()? != "2d" {
@@ -77,8 +78,29 @@ fn get_context(ctx: CallContext) -> Result<JsObject> {
       "Only supports 2d context".to_owned(),
     ));
   }
+
   let this = ctx.this_unchecked::<JsObject>();
-  this.get_named_property("ctx")
+  let ctx_js = this.get_named_property::<JsObject>("ctx")?;
+  let context_2d = ctx.env.unwrap::<Context>(&ctx_js)?;
+
+  if ctx.length == 2 {
+    let attrs = ctx.get::<JsObject>(1)?;
+    let alpha = attrs
+      .get_named_property::<JsBoolean>("alpha")?
+      .get_value()?;
+    if !alpha {
+      let mut fill_paint = context_2d.fill_paint()?;
+      fill_paint.set_color(255, 255, 255, 255);
+      let w: f64 = this.get_named_property::<JsNumber>("width")?.try_into()?;
+      let h: f64 = this.get_named_property::<JsNumber>("height")?.try_into()?;
+      context_2d.alpha = false;
+      context_2d
+        .surface
+        .draw_rect(0f32, 0f32, w as f32, h as f32, &fill_paint);
+    }
+  }
+
+  Ok(ctx_js)
 }
 
 #[js_function]