{"id":15387038,"url":"https://github.com/gkjohnson/polymer-trace","last_synced_at":"2025-11-13T22:53:40.577Z","repository":{"id":66338489,"uuid":"90093913","full_name":"gkjohnson/polymer-trace","owner":"gkjohnson","description":"Tool for tracing Polymer elements' lifecycles","archived":false,"fork":false,"pushed_at":"2017-11-05T23:21:28.000Z","size":135,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-05-25T11:39:15.221Z","etag":null,"topics":["debug","debugging","polymer","properties","stack","tool","trace","validation"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gkjohnson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-05-03T01:14:40.000Z","updated_at":"2025-01-31T20:57:21.000Z","dependencies_parsed_at":"2023-03-15T20:30:39.168Z","dependency_job_id":null,"html_url":"https://github.com/gkjohnson/polymer-trace","commit_stats":{"total_commits":24,"total_committers":1,"mean_commits":24.0,"dds":0.0,"last_synced_commit":"6ead3ee926fd8ea7388343f75e8eef126e475be1"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/gkjohnson/polymer-trace","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gkjohnson%2Fpolymer-trace","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gkjohnson%2Fpolymer-trace/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gkjohnson%2Fpolymer-trace/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gkjohnson%2Fpolymer-trace/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gkjohnson","download_url":"https://codeload.github.com/gkjohnson/polymer-trace/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gkjohnson%2Fpolymer-trace/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":284304462,"owners_count":26982161,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-11-13T02:00:06.582Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["debug","debugging","polymer","properties","stack","tool","trace","validation"],"created_at":"2024-10-01T14:51:33.938Z","updated_at":"2025-11-13T22:53:40.549Z","avatar_url":"https://github.com/gkjohnson.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# polymer-trace\n\n[![npm version](https://badge.fury.io/js/%40gkjohnson%2Fpolymer-trace.svg)](https://www.npmjs.com/package/@gkjohnson/polymer-trace)\n\nA debugging library that can be grafted onto any page with Polymer Elements to expose all the functions being called on Polymer elements over the course of its lifetime\n\nSurrogate functions are created that wrap the ones defined on registered Polymer elements, as well as for the following built in Polymer functions:\n- `async`\n- `debounce`\n- `addEventListener`\n- `Polymer.dom.flush`\n\n## Use\n#### Loading it\nInclude the `polymer-trace.js` or `polymer-trace.html` file at the top of the page before any other elements have loaded:\n```html\n\u003clink rel=\"import\" href=\".../polymer-trace.html\"/\u003e\n```\n```html\n\u003cscript type=\"text/javascript\" src=\"polymer-trace.js\"\u003e\u003c/script\u003e\n```\n\nThese should be removed before deployment\n\n#### Run time\nPolymer-Trace will print out a collapsible polymer function call stack with timing, as well as tallys of functions called over the last frame\n\n![example](/docs/example.png)\n\n#### Property Type Validation\nProperty values are automatically validated against their types when they are set\n\nFor more robust value validation, an additional functiona parameter `isValid` can be added to a property definition, which takes the set value and type of the property, and should return `true` or `false` to indicate whether ot not the value is valid\n\n#### Settings\nSettings for Polymer-Trace live on `Polymer.debug` and can be used to control the verbosity of the print statements. All settings can be changed during run time.\n\n```javascript\n/* Settings */\n{\n  // Whether or not to print the stack traces\n  enable: true,\n  \n  // Array of regex or strings used to test whether or not the \n  // registration of an element should have the debugger applied\n  // Both the element name and script path are checked\n  include: [/.*/g],\n  exclude: [/\\/node_modules\\//, /\\/bower_components\\//],\n  \n  // Whether or not to capture the traces from Polymer functions\n  printTrace: true,\n  \n  // Threshold in ms under which messages are not printed\n  threshold: 1,\n  \n  // Whether or not to include a full call stack in the \n  // print messages. Disabling improves performance\n  includeStack: true,\n  \n  // Whether or not to print out the tally of different\n  // function calls over the last frame\n  tallyCalls: true,\n  \n  // Whether or not to consume log functions including 'log', 'error',\n  // 'warning', 'groupCollased', 'group', 'groupEnd', 'dir', 'time', 'timeEnd'\n  // to be wrapped up into the stack trace\n  consumeLogs: true,\n   \n  // Whether or not to print out type validation for Polymer properties\n  validateProperties: true,\n    \n  // Colors to for printing\n  colors: {\n    light: '#90A4AE',\n    dark: '#37474F',\n    highlight: '#E91E63'\n  }\n}\n```\n\n## Gotchas\n- 'Getter' functions can get called prematurely when being registered because we iterate over all keys to check if something is a function\n- There is added overhead of tracking and printing function calls that should be kept in mind. Polymer-Trace is meant for coarse timing and understanding which functions are getting called when\n\n## TODOs\n- Traverse Polymer Behaviors so more function calls can be exposed\n- Wrap more built in Polymer functions\n  - `listen`\n- If `includeStack` is enabled but the time threshold isn't long enough to display or it's a child, don't include it to improve perf\n- Figure out how to wrap getter/setter functions\n- Track down bugs related to wrapping some of the paper elements\n- Polymer 2.x support\n- temporarily wrap functions like `requestAnimationFrame` or `setInterval` so we can see the impact\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgkjohnson%2Fpolymer-trace","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgkjohnson%2Fpolymer-trace","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgkjohnson%2Fpolymer-trace/lists"}