Closed Bug 1497210 Opened Last year Closed Last year

Flexbox inspector crashes the whole Layout sidebar tab when selecting a parent flex container

Categories

(DevTools :: Inspector, defect, P1)

defect

Tracking

(firefox64 fixed)

RESOLVED FIXED
Firefox 64
Tracking Status
firefox64 --- fixed

People

(Reporter: pbro, Assigned: gl)

References

(Blocks 1 open bug)

Details

Attachments

(1 file)

STR:
- open https://treeherder.mozilla.org/#/jobs?repo=try&revision=9e27545a9fee79ef2be628721170289ac01f00b3&selectedJob=203976072
- select node `#keyboard-shortcuts` in the inspector
- in the layout sidebar, click on the toggle to activate the flexbox highlighter (not sure this is actually needed to repro the crash)
- make sure you have the flex item accordion expanded too
- now in the inspector, select the parent element `.d-flex.flex-column.h-100` 

==> the layout tab crashes.

The following errors are displayed in the browser console:

TypeError: "flexItem is undefined; can't access its "nodeFront" property"
	render resource://devtools/client/inspector/flexbox/components/FlexItemSelector.js:73:11
	finishClassComponent resource://devtools/client/shared/vendor/react-dom.js:10332:22
	updateClassComponent resource://devtools/client/shared/vendor/react-dom.js:10295:10
	beginWork resource://devtools/client/shared/vendor/react-dom.js:10894:14
	performUnitOfWork resource://devtools/client/shared/vendor/react-dom.js:12713:12
	workLoop resource://devtools/client/shared/vendor/react-dom.js:12730:24
	renderRoot resource://devtools/client/shared/vendor/react-dom.js:12770:7
	performWorkOnRoot resource://devtools/client/shared/vendor/react-dom.js:13359:22
	performWork resource://devtools/client/shared/vendor/react-dom.js:13281:7
	performSyncWork resource://devtools/client/shared/vendor/react-dom.js:13253:3
	requestWork resource://devtools/client/shared/vendor/react-dom.js:13153:5
	1 resource://devtools/client/shared/vendor/react-dom.js:13022:11
	enqueueSetState resource://devtools/client/shared/vendor/react-dom.js:8845:5
	setState resource://devtools/client/shared/vendor/react.js:406:3
	onStateChange resource://devtools/client/shared/vendor/react-redux.js:1412:11
	dispatch resource://devtools/client/shared/vendor/redux.js:416:7
	waitUntilService resource://devtools/client/shared/redux/middleware/wait-service.js:59:20
	promiseMiddleware resource://devtools/client/shared/redux/middleware/promise.js:16:14
	thunk resource://devtools/client/shared/redux/middleware/thunk.js:16:9
	task resource://devtools/client/shared/redux/middleware/task.js:39:12
	update resource://devtools/client/inspector/flexbox/flexbox.js:451:7
react-dom.js:11273:5

​
Blocks: 1478396
Priority: -- → P1
Assignee: nobody → gl
Status: NEW → ASSIGNED
Blocks: dt-flexbox
Attached patch 1497210.patchSplinter Review
Attachment #9016144 - Flags: review?(pbrosset)
Attachment #9016144 - Flags: review?(pbrosset) → review+
Pushed by gabriel.luong@gmail.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/e68617c25cbe
Ensure a valid flex item prop is provided to the FlexItemSelector. r=pbro
https://hg.mozilla.org/mozilla-central/rev/e68617c25cbe
Status: ASSIGNED → RESOLVED
Closed: Last year
Resolution: --- → FIXED
Target Milestone: --- → Firefox 64
You need to log in before you can comment on or make changes to this bug.