Skip to content
This repository has been archived by the owner on Apr 5, 2022. It is now read-only.

StoryCloud/webkit-assign

Repository files navigation

webkit-assign Build Status

Due to WebKit issue #138038, assigning to a property of an object created with Object.create may result in the error TypeError: Attempted to assign to readonly property.. This bug is known to affect iOS 8 users and is likely to occur in recent versions of Angular.js and PDF.js.

This utility rewrites the following code

object.$$a = 5;

to this

var __webkitAssign__$$a = "$$a";
object[__webkitAssign__$$a] = 5;

as a workaround to prevent a TypeError.

Usage

webkit-assign provides a CLI interface (when installed globally via npm i -g webkit-assign). Specify any number of files, and each one will be transformed and saved to a file with a .webkitassign.js extension in the same directory.

For instance, the below command produces a transformed version of angular.js with the name angular.webkitassign.js in the same directory:

$ webkit-assign angular.js

In Node.js, you can require webkit-assign (when installed locally via npm i webkit-assign), and pass code to the module as a string:

var fs = require('fs');
var webkitAssign = require('webkit-assign');
var original = fs.readFileSync('node_modules/angular/angular.js', 'utf8');
var transformed = webkitAssign(original);
fs.writeFileSync('build/scripts/angular.js', code);

You can also obtain a transform stream by calling webkitAssign() (without any arguments), and pipe code through it:

var fs = require('fs');
var webkitAssign = require('webkit-assign');
fs.createReadStream('node_modules/angular/angular.js')
    .pipe(webkitAssign())
    .pipe(fs.createWriteStream('build/scripts/angular.js'));

Plugins

We offer several plugins, all hosted in this repository.

A gulp plugin:

var gulp = require('gulp');
var webkitAssign = require('webkit-assign/gulp');
gulp.src('node_modules/angular/angular.js')
    .pipe(webkitAssign())
    .pipe(gulp.dest('build/scripts'));

A Browserify transform:

"browserify": {
  "transform": [
    "webkit-assign/browserify"
  ]
}

A Webpack loader:

loaders: [
  {
    test: /angular\.js$/,
    loader: 'webkit-assign/webpack'
  }
]

Contributing

Install the module locally via git:

$ git clone https://github.com/StoryCloud/webkit-assign.git
$ cd webkit-assign
$ npm install
$ npm link

Please provide unit tests and documentation for any changes. Try to maintain existing formatting and naming conventions. You can check your code with npm test.