forked from mirrors/gecko-dev
		
	Bug 1600263 - Switch the Application panel to use the new TargetList API r=jdescottes
Differential Revision: https://phabricator.services.mozilla.com/D57139 --HG-- extra : moz-landing-system : lando
This commit is contained in:
		
							parent
							
								
									39a0983bcc
								
							
						
					
					
						commit
						17938124b0
					
				
					 1 changed files with 52 additions and 11 deletions
				
			
		|  | @ -44,26 +44,31 @@ const App = createFactory( | |||
|  */ | ||||
| window.Application = { | ||||
|   async bootstrap({ toolbox, panel }) { | ||||
|     // bind event handlers to `this`
 | ||||
|     this.handleOnNavigate = this.handleOnNavigate.bind(this); | ||||
|     this.updateWorkers = this.updateWorkers.bind(this); | ||||
|     this.updateDomain = this.updateDomain.bind(this); | ||||
|     this.updateCanDebugWorkers = this.updateCanDebugWorkers.bind(this); | ||||
|     this.onTargetAvailable = this.onTargetAvailable.bind(this); | ||||
|     this.onTargetDestroyed = this.onTargetDestroyed.bind(this); | ||||
| 
 | ||||
|     this.mount = document.querySelector("#mount"); | ||||
|     this.toolbox = toolbox; | ||||
|     // NOTE: the client is the same through the lifecycle of the toolbox, even
 | ||||
|     // though we get it from toolbox.target
 | ||||
|     this.client = toolbox.target.client; | ||||
| 
 | ||||
|     this.store = configureStore(); | ||||
|     this.actions = bindActionCreators(actions, this.store.dispatch); | ||||
| 
 | ||||
|     services.init(this.toolbox); | ||||
|     await l10n.init(["devtools/application.ftl"]); | ||||
| 
 | ||||
|     this.deviceFront = await this.client.mainRoot.getFront("device"); | ||||
| 
 | ||||
|     await this.updateWorkers(); | ||||
|     this.workersListener = new WorkersListener(this.client.mainRoot); | ||||
|     this.workersListener.addListener(this.updateWorkers); | ||||
|     this.toolbox.target.on("navigate", this.handleOnNavigate); | ||||
| 
 | ||||
|     this.deviceFront = await this.client.mainRoot.getFront("device"); | ||||
|     await this.updateCanDebugWorkers(); | ||||
|     if (this.deviceFront) { | ||||
|       this.canDebugWorkersListener = this.deviceFront.on( | ||||
|         "can-debug-sw-updated", | ||||
|  | @ -71,14 +76,16 @@ window.Application = { | |||
|       ); | ||||
|     } | ||||
| 
 | ||||
|     // start up updates for the initial state
 | ||||
|     this.updateDomain(); | ||||
|     await this.updateCanDebugWorkers(); | ||||
|     await this.updateWorkers(); | ||||
| 
 | ||||
|     await l10n.init(["devtools/application.ftl"]); | ||||
|     // awaiting for watchTargets will return the targets that are currently
 | ||||
|     // available, so we can have our first render with all the data ready
 | ||||
|     await this.toolbox.targetList.watchTargets( | ||||
|       [this.toolbox.targetList.TYPES.FRAME], | ||||
|       this.onTargetAvailable, | ||||
|       this.onTargetDestroyed | ||||
|     ); | ||||
| 
 | ||||
|     // Render the root Application component.
 | ||||
|     this.mount = document.querySelector("#mount"); | ||||
|     const app = App({ | ||||
|       client: this.client, | ||||
|       fluentBundles: l10n.getBundles(), | ||||
|  | @ -114,16 +121,50 @@ window.Application = { | |||
|     ); | ||||
|   }, | ||||
| 
 | ||||
|   setupTarget(targetFront) { | ||||
|     this.handleOnNavigate(); // update domain and manifest for the new target
 | ||||
|     targetFront.on("navigate", this.handleOnNavigate); | ||||
|   }, | ||||
| 
 | ||||
|   cleanUpTarget(targetFront) { | ||||
|     targetFront.off("navigate", this.handleOnNavigate); | ||||
|   }, | ||||
| 
 | ||||
|   onTargetAvailable({ targetFront, isTopLevel }) { | ||||
|     if (!isTopLevel) { | ||||
|       return; // ignore target frames that are not top level for now
 | ||||
|     } | ||||
| 
 | ||||
|     this.setupTarget(targetFront); | ||||
|   }, | ||||
| 
 | ||||
|   onTargetDestroyed({ targetFront, isTopLevel }) { | ||||
|     if (!isTopLevel) { | ||||
|       return; // ignore target frames that are not top level for now
 | ||||
|     } | ||||
| 
 | ||||
|     this.cleanUpTarget(targetFront); | ||||
|   }, | ||||
| 
 | ||||
|   destroy() { | ||||
|     this.workersListener.removeListener(); | ||||
|     if (this.deviceFront) { | ||||
|       this.deviceFront.off("can-debug-sw-updated", this.updateCanDebugWorkers); | ||||
|     } | ||||
|     this.toolbox.target.off("navigate", this.updateDomain); | ||||
| 
 | ||||
|     this.toolbox.targetList.unwatchTargets( | ||||
|       [this.toolbox.targetList.TYPES.FRAME], | ||||
|       this.onTargetAvailable, | ||||
|       this.onTargetDestroyed | ||||
|     ); | ||||
| 
 | ||||
|     this.cleanUpTarget(this.toolbox.target); | ||||
| 
 | ||||
|     unmountComponentAtNode(this.mount); | ||||
|     this.mount = null; | ||||
|     this.toolbox = null; | ||||
|     this.client = null; | ||||
|     this.workersListener = null; | ||||
|     this.deviceFront = null; | ||||
|   }, | ||||
| }; | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue
	
	 Belén Albeza
						Belén Albeza