Provide a lint to not use `identical` when the arguments are JS types

[gmpassos]

The code below, when run in the browser (Chrome), shows that identical behaves differently in JS and Wasm:

import 'package:web/web.dart';

void main() {
  var output = document.querySelector('#output'); // a div in the index.html

  var div1 = HTMLDivElement()
    ..id = 'div1'
    ..textContent = 'aaa';

  var div2 = HTMLDivElement()
    ..id = 'div2'
    ..textContent = 'aaa';

  var div1a = div1;

  print('div1 == div2 = ${div1 == div2}');
  print('identical(div1, div2) = ${identical(div1, div2)}');
  print('div1 == div1a = ${div1 == div1a}');
  print('identical(div1, div1a) = ${identical(div1, div1a)}');

  output!.appendChild(div1);
  output.appendChild(div2);

  print('-- From querySelector:');

  var div1B = output.querySelector('#div1') as HTMLDivElement;
  var div2B = output.querySelector('#div2') as HTMLDivElement;

  print('div1 == div1B = ${div1 == div1B}');
  print('identical(div1, div1B) = ${identical(div1, div1B)}');
  print('div2 == div2B = ${div2 == div2B}');
  print('identical(div2, div2B) = ${identical(div2, div2B)}');
}

Output dart2js:

div1 == div2 = false
identical(div1, div2) = false
div1 == div1a = true
identical(div1, div1a) = true
-- From querySelector:
div1 == div1B = true
identical(div1, div1B) = true
div2 == div2B = true
identical(div2, div2B) = true

Output dart2wasm:

div1 == div2 = false
identical(div1, div2) = false
div1 == div1a = true
identical(div1, div1a) = true
-- From querySelector:
div1 == div1B = true
identical(div1, div1B) = false
div2 == div2B = true
identical(div2, div2B) = false

My suggestion is to at least document this behavior.

[kevmoo]

@srujzs – if this is something we can't fix, it's likely something we should lint – right?

[srujzs]

Indeed they'll give different values. dart2wasm boxes values whereas dart2js/DDC does not. This is documented at the library-level: https://api.dart.dev/stable/latest/dart-js_interop/index.html

if this is something we can't fix, it's likely something we should lint – right?

It'd be nice - we may consider including it in invalid_runtime_checks_with_js_interop_types or add a new lint altogether. One option is to always lint if the arguments are JS types to identical, even if they are indeed the same value. This wouldn't catch upcasts to Object naturally.

[gmpassos]

I agree to add a lint, but if both values are JSAny, won't be simple to check for "identical" using the "native" value of the boxed value? Without performance issues.

[ykmnkmi]

Is it safe to compare ExternalDartReference?

[srujzs]

I agree to add a lint, but if both values are JSAny, won't be simple to check for "identical" using the "native" value of the boxed value? Without performance issues.

That's a good question. I believe this is the corresponding code for the intrinsic function that dart2wasm uses. @mkustermann Is it possible to special case JSValues here and forward it to do the comparison between the two underlying JS values instead? Is that something we want as well?

Is it safe to compare ExternalDartReference?

Also a good question! Yes, with the same constraints as JS types (identical may gave you different values but == operates as expected):

sdk/tests/lib/js/static_interop_test/external_dart_reference_test.dart

Line 80 in 25a8f54

Expect.equals(externalDartReference, dartObject.toExternalReference);

.